Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Imagen de fondo aleatoria en el blog

Previamente aprendimos a insertar una imagen de fondo aleatorio a los títulos de la sidebar (barra lateral).

En esta entrada veremos la forma de añadir varias imágenes de fondo al blog y que aparezcan de forma aleatoria cada vez que el sitio web se actualice o se navegue entre su contenido.

Imagen de fondo aleatoria en el blog


Puedes ver un ejemplo en este blog (el cual deberás actualizarlo varias veces para comprobar que la imagen de fondo cambia correctamente).


Diseño>Edición de HTML>expandimos artilugios




Busca la etiqueta </head> e inserta este script justo encima:

<script type='text/javascript'>
var blimgaleat= new Array()
blimgaleat[0]=&quot;URL DE LA IMAGEN 1&quot;
blimgaleat[1]=&quot;URL DE LA IMAGEN 2&quot;
blimgaleat[2]=&quot;URL DE LA IMAGEN 3&quot;
blimgaleat[3]=&quot;URL DE LA IMAGEN 4&quot;

var random=Math.floor(Math.random()* (blimgaleat.length));
document.write(&quot;<style>&quot;);
document.write(&quot;body {&quot;);
document.write(&#39; background:url(&quot;&#39; + blimgaleat[random] + &#39;&quot;) repeat center;&#39;);
document.write(&quot; }&quot;);
document.write(&quot;</style>&quot;);
</script>

Reemplaza URL DE LA IMAGEN por la dirección de las imágenes de fondo. En el código he insertado un total de cuatro líneas que mostrarán cuatro fondos distintos de manera aleatoria.

Si te fijas, la primera línea tiene el valor 0 en el atributo blimgaleat[0] pero en realidad es la primera imagen.

Para añadir más imágenes bastará con insertar líneas como esta:

blimgaleat[4]=&quot;URL DE LA IMAGEN 5&quot;

Y sustituir las cifras numéricas por las correspondientes.

Guarda la plantilla para terminar...


Anónimo dice...

Cómo puedo hacer para que la imagen quede estatica :-I

Jaime Trujillo Escobedo dice...

Eso es algo muy sencillo, Anónimo. En esta entrada explico como hacerlo ;).

Driwrgy dice...

Qué guay! Posibilidad de conseguir que el fondo del blog corresponda con una etiqueta específica? Me vendría genial para enlazar con mi blog privado de dietética y asignar a cada grupo de alimentos un color de fondo. Eres desde luego lo que no hay. Qué de cosas aprendo contigo! Un besito y GRACIAS.

Jaime Trujillo Escobedo dice...

Aún no he publicado el truco que deseas, Driwrgy, pero pronto lo encontrarás en El Balcón. Se nota que estás aprendiendo, es fascinante ver los progresos que vas haciendo en tu plantilla.

¡Abrazos!

Driwrgy dice...

Jo, este truqui no se puede aplicar en la plantilla fantástica... me venía bien porque puedo optar por la doble sidebar peeero me voy a tener que quedar donde mismo... :(

Jaime Trujillo Escobedo dice...

Uff, me temo que sería complicado Driwrgy, sobre todo si se trata de las nuevas plantillas de blogger (como es tu caso).

De todas formas no te preocupes, puede que modifique un poco el script y haga que sea válido en las plantillas del diseñador.

Por cierto, atenta a la entrada que publicaré mañana: podría serte útil para alguno de tus blogs.

Anónimo dice...

Very efficiently written information. It will likely be useful to anyone who usess it, including myself. Keep up the great work – for certain i will check out extra posts.

Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo