[BBCODE] Enlaces de descarga mediante imagen alternativaTema Solucionado

[picaron]

Nombre: [BBCODE] Enlaces de descarga mediante imagen alternativa
Autor: Picaron
Descripción: BBcode que posibilita acceder a los archivos enlazados en nuestro foro abriéndolos en una ventana nueva del explorador, cuando hacemos click sobre una imagen, la cual cambia al posicionar el ratón encima de ella, dando así un toque de atención al navegante de la disponibilidad del enlace.
Fuente: http://www.ascensoristas.net

Imagenes utilizadas. (Cada uno puede elegir las que desee respetando el nombre de los archivos).



Descargar las imágenes (Click derecho en la imagen y seleccionar "Guardar imagen como...") y subirlas a la carpeta images donde se encuentra tu foro.

../images/descargar_azul.png
../images/descargar_rojo.png

Nota: Indispensable tener habilitado JavaScript en nuestro navegador.

Creando el BBcode

Uso de BBcode:

Código: Seleccionar todo

[descargar]{URL}[/descargar]

Reemplazo HTML:

Código: Seleccionar todo

<script language="JavaScript">

var nume = Math.floor(Math.random()*80000)+10000;
var num = nume.toString();

if (document.images)
{
img_azul=new Image();
img_rojo=new Image();
img_azul.src="images/descargar_azul.png";
img_rojo.src="images/descargar_rojo.png";
}

function sobre(k) {
if (document.images)
eval('document.img'+k+'.src=img_rojo.src');
}

function fuera(k) {
if (document.images)
eval('document.img'+k+'.src=img_azul.src');
}

</script>

<table>
<tr>
<td>
<script language="LiveScript">
<!--
    var html = '<a href=\"{URL}\" target="_blank" onMouseOver="sobre('+ num +');return true;" onMouseOut="fuera('+ num +');return true;"><img src="images/descargar_azul.png" name="img'+ num +'" border="0"></a>';
   document.write(html);
//--> 		
		
</script>
</td>
</tr>
</table>

Línea de ayuda:

Código: Seleccionar todo

[descargar]URL de descarga del Archivo[/descargar]

---

Ejemplo:

Código: Seleccionar todo

[descargar]http://www.ascensoristas.net/images/descargar_azul.png[/descargar]
[descargar]http://www.ascensoristas.net/images/descargar_rojo.png[/descargar]

Demo:
Click aquí para ver ejemplo de Uso

No es necesario limpiar el cache del foro, ni refrescar el navegador.
Ya podéis hacer la prueba del BBcode.
Espero que os guste.






URL: http://www.ascensoristas.net
Versión phpBB: 3.0.8
MODs Instalados: Board3 Portal 1.0.6
Ajax chat
Evaluate Topics
Manage attachments module phpBB3
Megaupload FileBox MOD v1.0.0
Mod similar topics v1.0.1
Prime Quick Reply
Prime Warnings
Search back v1.0.3
Skype mod
Topic in Who is Online
Plantilla(s) usada(s): Basada en Prosilver
Servidor: Linux
Actualización desde otra versión: 3.0.7
Conversión desde otro sistema de foros: No

[uruguayito]

gracias.
me lo llevo

[ruben1155]

Ya los estoy usando

[karbiko]

Muchas Gracias...

Una cuestión:
he tratado de centrar la imagen

[descargar] url y el cierre de ambos, pero no me funciona...

¿No es posible usarlos conjuntamente?

[leviatan21]

Una cuestión:
he tratado de centrar la imagen

[descargar] url y el cierre de ambos, pero no me funciona...

Los bbcodes personalizados (creados desde el ACP ) no se pueden anidar

[uruguayito]

Muchas Gracias...

Una cuestión:
he tratado de centrar la imagen

[descargar] url y el cierre de ambos, pero no me funciona...

¿No es posible usarlos conjuntamente?

al parecer no ...a mí me pasó igual

[picaron]

Gracias por la cálida acogida a mi primer BBcode.

Como bien dice nuestro amigo leviatan21, los bbcodes personalizados no se pueden anidar, pero aquí os dejo la modificación del HTML para el que quiera ver la imagen centrada en el cuerpo del mensaje.

Reemplazo HTML para ver imagen centrada (Sustituir el anterior Reemplazo HTML completo por este):

Código: Seleccionar todo

<script language="JavaScript">

var nume = Math.floor(Math.random()*80000)+10000;
var num = nume.toString();

if (document.images)
{
img_azul=new Image();
img_rojo=new Image();
img_azul.src="images/descargar_azul.png";
img_rojo.src="images/descargar_rojo.png";
}

function sobre(k) {
if (document.images)
eval('document.img'+k+'.src=img_rojo.src');
}

function fuera(k) {
if (document.images)
eval('document.img'+k+'.src=img_azul.src');
}

</script>

<table width="100%" border="0">
<tr>
<td><div align="center">
<script language="LiveScript">
<!--
    var html = '<a href=\"{URL}\" target="_blank" onMouseOver="sobre('+ num +');return true;" onMouseOut="fuera('+ num +');return true;"><img src="images/descargar_azul.png" name="img'+ num +'" border="0"></a>';
   document.write(html);
//--> 		
		
</script>
</div></td>
</tr>
</table>

Un saludo.

[Jaizu]

Seguro lo uso, como hago para activarlo, e instalarlo?
Bueno, ya me las arreglaré, está bien la cosa xD

[karbiko]

funciona perfectamente.

Muchas gracias picaron... y ¡¡¡Enhorabuena!!!