Imágenes aleatorias en el blog con JavaScript

imagenes aleatorias en el blog

En la tarde estuve ayudando a un tipo que quería mostrar imágenes aleatorias con javascript en su web y que estas fueran clikeables, para insertar imágenes que llevan a otra pagina y que ademas estas fueran diferentes cada que uno entra a la pagina.

Me puse a programar un poco y este es el script que resulto.

1
2
3
4
5
6
7
8
<script language="Javascript">
var imagen = new Array();
imagen[0] = new Array('El buscador que lo encuentra todo','http://google.com/','http://twittmxl.com/jcarousel/125x125.jpg','Blog de soy cachanilla');
imagen[1] = new Array('El blog de daniel','http://soycachanilla.com/','http://i42.tinypic.com/2qite9f.png','otro blog raro');
imagen[2] = new Array('Pagina porkis con animales y todo eso','http://disney.com/','http://i27.tinypic.com/2cqi91h.jpg','pagina de disney');
var posicion = Math.round(Math.random()*2);
document.write("<a title="+imagen[posicion][0]+" href="+imagen[posicion][1]+"><img border='5px' src="+imagen[posicion][2]+" tag="+imagen[posicion][3]+" /></a>");
</script>

El script es bastante sencillo, en el utilice una matriz llamada imagen, en donde cada renglón de esta matriz tendrá 4 campos (columnas).

  • title imagen[posicion][0]
  • link de la pagina imagen[posicion][1]
  • link de la imagen imagen[posicion][2]
  • tag imagen[posicion][3]

Después hago un random para elegir un numero entre el 0,1 y 2, que determinará el número(posición) del renglón del cual vamos a jalar los datos para imprimirlos con un document.write.

Como se trata de una matriz hay que indicar la columna del renglón que vamos a imprimir, por ejemplo, si el número del random fue 2, se reemplaza por la variable [posicion], sería algo así.

  • imagen[2][0] <– Esto imprime el titulo del renglón 2 del array.
  • imagen[2][3] <– Esto imprime el tag del renglón 2 del array.

Así de fácil, ahora si ya pueden poner banners donde quieran sin usar flash!.

    1. danielmd 30 marzo 2010
    2. anoniom 10 mayo 2011

    Leave a Comment

    Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.