2012-01-11 20 views
6

He intentado varios tutoriales en la web y ninguno parece funcionar correctamente. Lo que intento hacer es bastante simple. Pienso:Random body background-image

Tengo 9 imágenes .jpg diferentes que necesito mostrar al azar en la carga de la página: para que sean de fondo. Esto debería ser bastante simple ¿no?

Gracias,

EDITAR (Lo sentimos, se olvidó de colocar el código - que se encuentra en la web):

$(document).ready(function(){ 

    bgImageTotal=9; 

    randomNumber = Math.round(Math.random()*(bgImageTotal-1))+1; 

    imgPath=('../img/bg/'+randomNumber+'.jpg'); 

    $('body').css('background-image', ('url("'+imgPath+'")')); 

}); 
+2

Generalmente se prefiere si publica un código que ha intentado usar que no funcionará en lugar de simplemente pedirle a la gente que lo escriba. –

+0

Es cierto, lo siento ... se olvidó de adjuntar el código. – asirgado

+0

Sí, todo dependerá del idioma que uses en cuanto a cómo lo harías. – Paul

Respuesta

22

Salida este tutorial: http://briancray.com/2009/12/28/simple-image-randomizer-jquery/

En primer lugar crear una serie de imágenes:

var images = ['image1.jpg', 'image2.jpg', 'image3.jpg', 'image4.jpg', 'image5.jpg']; 

A continuación, establezca una imagen aleatoria como imagen de fondo:

$('body').css({'background-image': 'url(images/' + images[Math.floor(Math.random() *  images.length)] + ')'}); 

Eso debería funcionar sin problemas.

+0

¿Cómo debería llamar a mi función? No estoy acostumbrado a javascript, gracias. – asirgado

+0

no debería necesitar llamar a una función, solo póngala dentro de la etiqueta jQuery $ (document) .ready (function() {}. –

+0

Sí, funciona. Tuve un problema con el enlace de script para jQuery. 'Enlazando la biblioteca en primer lugar. ¡Gracias! – asirgado

0

usando jQuery: $("body").css("background-image", "url(" + Math.floor(Math.random()*9) + ".jpg)");

Esto es suponiendo, que sus imágenes se nombran 0.jpg hasta 8.jpg y están en el mismo directorio que su página.