En una anterior ocasión explicamos como generar y mostrar frases aleatorias para, por ejemplo, lucir nuestras citas favoritas cada vez que se cargue nuestra página. Algun@s pidieron el mismo truco pero para mostrar imágenes distintas al azar en cada ocasión que se nos visita. Pues helo aquí...
Facilito, facilito. Sólo hay que copiar este código dónde queramos mostrarlas.
<script language="JavaScript">
function ver_imagen()
{
n=0;
this[n++]="DIRECCION IMAGEN 1";
this[n++]="DIRECCION IMAGEN 2";
this[n++]="DIRECCION IMAGEN 3";
this[n++]="DIRECCION IMAGEN 4";
this.N=n;
}
var imagen=new ver_imagen();
src= imagen[ Math.floor(Math.random() * imagen.N) ] ;
document.write("<img src="+src+">");
</script>
function ver_imagen()
{
n=0;
this[n++]="DIRECCION IMAGEN 1";
this[n++]="DIRECCION IMAGEN 2";
this[n++]="DIRECCION IMAGEN 3";
this[n++]="DIRECCION IMAGEN 4";
this.N=n;
}
var imagen=new ver_imagen();
src= imagen[ Math.floor(Math.random() * imagen.N) ] ;
document.write("<img src="+src+">");
</script>
Hay que sustituir cada DIRECCION IMAGEN, por la dirección URL de nuestras propias imágenes y listo.
Para cada imagen, una línea this[n++]="DIRECCION IMAGEN 1";.
Para cada imagen, una línea this[n++]="DIRECCION IMAGEN 1";.
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
hola como va todo yo aqui de nuevo molestando jejeje tengo una pregunta que les interesara a todos ¿como hacer una galeria de fotos Coppermine Photo Gallery? porque eh intentando en varias paginas de internet y me resulta super dificil si tu sabes porfa explicalo
ResponderEliminarchau!! cuidate
En este enlace he encontrado una explicación muy clarita.
ResponderEliminarLo que ocurre es que con Blogger no vas a poder instalar este sistema, porque creo que ni soporta PHP ni bases de datos SQL.
Prueba a echar un vistazo a esta entrada sobre una aplicación para mostrar tus imágenes, que además te permite crear galerias.
Un ejemplo en Sin Entradas.
Saludos,
Hola Oloman! Se que tiene algún tiempo esta entrada ya, pero aún así quería hacerte una pregunta, y es si sabes si sería posible aplicar este código al fondo del blog. Estoy rediseñando un blog que tengo con unos colegas y quería poner una imágen fija de fondo y cómo no se muy bien qué imagen poner exactamente se me ha ocurrido que quizá podría hacerse para que saliesen imágenes aleatorias...
ResponderEliminarUn saludo!!:-D
Pues... le echaré un vistazo Agustín, pero como ando cortito de tiempo, ve eligiendo un fondo por si tardo
ResponderEliminar:-)
:) ok ok, tranquilo, no hay prisa ninguna, que yo también me lo estoy tomando con mucha calma.
ResponderEliminarSaludos!
Respuesta a tu consulta recién publicada, Agustín. "Fondos aleatorios"
ResponderEliminarEs genial este truco. Solo tiene una pega que no se cómo resolver.
ResponderEliminarMe gustaría incluir un enlace en cada una de las imágenes. De esto modo, la función de "espacio publicitario" a la que he dedicado este truco sería el idóneo. ¿Cómo puedo hacer esto? Muchas gracias por adelantado.
Hola Juan. Como no controlo demasiado en Javascript, no sé meterlo dentro, así que cambia
ResponderEliminarvar imagen=new ver_imagen();
src= imagen[ Math.floor(Math.random() * imagen.N) ] ;
document.write("<img src="+src+">");
</script>
por esto otro
function imp_imagen()
{
var imagen=new ver_imagen();
src= imagen[ Math.floor(Math.random() * imagen.N) ] ;
document.write("<img src="+src+">");
}
</script>
<a href="URL-a-enlazar"><script type="text/javascript">imp_imagen()</script></a>
Esto seguro que funciona.
No lo entiendo... parece que sólo puedo poner un enlace, y que este será el mismo para todas las imágenes, ¿o me equivoco? Bueno, voy a probar. Gracias y un saludo.
ResponderEliminarTal vez no me expliqué bien. Lo que yo quería es poner un enlace "diferente" en cada imagen. ¿Sabes cómo?
ResponderEliminarYa creo que lo tengo claro Juan. A ver si el post que he publicado hoy responde a tu pregunta
ResponderEliminarSaludos.
Hola que tal mi nombre es Christian y te doy 10 por el blog que tenes.
ResponderEliminarAhora, podrías ayudarme , mira en mi blog tengo una sección para los banner de 125x125 son tres y están uno a lado del otro estés es la plantilla:
http://vibrant-btemplates.blogspot.com/
bueno lo que deseo, es que cada imagen cambien de forma aleatoria con enlaces diferentes ¿como podria hacerlo en este caso?
desde ya muchas gracias
CCS, esta es una manera de hacerlo, aunque tendrás que modificar algo el código para ajustarlo a tu plantilla.
ResponderEliminarHola, como podria hacer para que esta imagen cambie cada cierta cantidad de segundos?
ResponderEliminarHmmm... Plata creo que lo mejor para eso si no son demasiadas imágenes, sería utilizar un gif animado como el que, casualmente, ilustra esta entrada.
ResponderEliminarSi son muchas, quizás te interese utilizar este otro sistema:
http://oloblogger.blogspot.com/2010/09/script-para-programar-elementos.html