Puede que te interese poner algunas imágenes que carguen de forma aleatoria en tu Blog. Por ejemplo, en este blog puedes ver que cada vez que lo cargas aparece una imagen diferente.
Para hacerlo yo siempre me creo una función que genera números aleatorios a partir del Math.random() de JavaScript, simplemente un poco más "elaborada" para pedirle fácilmente un número aleatorio entre dos valores.
La función es esta:
function aleatorio(inf,sup){Te devuelve un número aleatorio entre "inf" y "sup", ambos incluidos. Una vez tenemos resuelto el problema de generar un número aleatorio lo que podemos hacer es crear un array de imágenes como a continuación:
numP = sup - inf;
rnd = Math.random() * numP;
rnd = Math.round(rnd);
return parseInt(inf) + rnd;
}
var imagenes =Podemos añadir tantas imágenes como queramos, indicando la url de cada una de ellas. Ahora sólo queda enlazarlo todo.
new Array('http://direccion/a/la/imagen1.jpg',
'http://direccion/a/la/imagen2.jpg'
);
var num = aleatorio(0,imagenes.length-1);Eso es todo, ahora cada vez que cargues la página aparecerá aleatoriamente una de las imágenes que hayas indicado en el array.
document.write("<img src='"+imagenes[num]+"' />");
Puedes ponerlo en Blogger creando un bloque de HTML/JavaScript.
También puedes descargar el código completo.
by Nenillo
17 Bloggycomentarios:
Gracias por el código.
Lo busqué por muchos sitios y ninguno funcionaba, hasta que me topé con éste. Lo probé sin esperanzas pero finalmente, ¡funcionó!
Saludos!
Me alegro de que te haya funcionado :D
Gracias por el codigo pero yo soy novato en esto y no se en que parte de el codigo de la plantilla tengo que ponerlo??
Tienes que buscar el lugar del código donde quieras mostrar la imagen y ahí es donde tendrás que pegar el código que se indica en el post.
Quizá te interese echar un vistazo a este post http://mayuuchiha.blogspot.com/2007/08/edicin-de-plantillas-qu-necesitas-saber.html
Una consulta...es posible luego de tener la secuencia aleatoria de las imagenes, convertirla en un link para otros post en el blog? Es decir, en lugar de usar textos para conectarte aleatoriamente con post pasados emplear imagenes del blog - las que corresponden a cada entrada -
Si hay alguna manera, escribir a memorias.del.pinball@gmail.com
Gracias
Saludos desde Lima
hola, en primer lugar te agradezco por el tiempo ke dedicas a ayudar a los ke no sabemos mucho de codigos, he intentado hacer la cabecera de mi blo aleatoria pero he probado muchos de los codigos que he encontrado en la red y ninguno funciona, estoy utilizando la platilla blogy minimalista negro de BLOGANDWEB.COM esta es la seccion del codigo ke corresponde a la imagen ke kiero radomizar.
/*-- (Cabecera) --*/
#header-wrapper {
text-align:left;
width: 658px;
padding:0px;
margin:0px auto;
position: relative;
height: 200px;
background-image:
url(http://i117.photobucket.com/albums/o76/eenrijk/headermedesdarocha.jpg);
background-repeat: no-repeat;
la he puesto el lugar de url y no funciona talvez no sea compatible para mi plantilla si sabes de alguna compatible escribeme te dejo mi correo faeroe@hotmail.com
muchas gracias
saludos!!
El código que explicamos en este artículo no se puede poner en la sección que indicas. La sección que indicas es CSS y ahí no se puede meter código JavaScript, que es lo que te ofrecemos.
Lo que puedes hacer es meter el código entre <head> y </head> y cambiar la línea de document.write por esta:
window.onload = function () {
document.getElementById('header-wrapper ').style.backgroundImage = 'url('+imagenes[num]+')';
}
En teoría debería funcionarte así.
Despues de tanto intentarlo ha funcionado!!!! :D
muchas gracias por el tip
te felicito por tu pagina y compartir tus conocimientos
feliz anho 2008!!
podrias explicarme como fuiste logrando tales presentaciones en tu blog, soy nueva en esto!!!
podrias explicarme como lograste tal presentación de tu blog...
anónimo... realmente no es tan complicado, sobre todo tienes que practicar mucho, leer tutoriales, manuales, ver código de otros, seguir prácticando...
Con el tiempo puedes llegar a hacer cosas interesantes.
Hola, disculpa la molestia, pero es que tengo un problema.
Gracias a este tip pude implementar las imágenes aleatorias en mi blog pero, ahora que estoy haciendo cambios y preparándolos en un blog de prueba, no me me aparecen las imágenes aleatorias en la cabecera del blog. Creo que es porque el nuevo template no reconoce el script, pero no soy ninguna experta. ¿Me podrías ayudar?
Éste es el blog al que sí le sirvió esto de las imágenes aleatorias: http://aesir1.blogspot.com/
Y éste es el blog al que le estoy haciendo las pruebas, y en el que no funciona tu truco: http://aoshi-chan03.blogspot.com/
Como puedes ver, ambos tienen una tabla en donde va el banner, pero esto no parece afectarles. Ojalá me puedas ayudar. Estoy desesperada ToT
Gracias :)
Fíjate en las diferencias entre el primer código y el segundo, es por eso que no funciona.
En el primer código las URL están entrecomilladas, en el segundo no.
Las urls deben ir así: 'http://ejemplo.com/imagen.jpg'
Oh, muchas gracias!!! No puedo creer que no lo haya notado antes. Ya decía yo que era raro que tu código no me sirviera. ¡Ahora se ve de maravilla!
Mil gracias, y disculpa la molestia (y la ignorancia o///o)
disculpa la molestia uchija pero el codigo java scrip no abre la pagina para descargar ,,,.. porfavor apenas lo tengas facilitanoslo ..grax....salu2
Publicar un comentario