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!.

2 Comentarios

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

Deja un comentario

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