11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour, j'utilise un script en jquery pour changer le background du body de mon site toutes les 20 secondes, ce script marche très bien mais j'aimerais faire si possible un fadein durant cette action pour créer une amélioration visuel. Comment appliquer la fonction fadein lors de suppression et l'ajout d'une class au body ? J'espère avoir été le plus précis possible, merci pour vos réponses, Jérémy.

code original:

$(document).ready(function(){
 
  (function(){ 
  var i = 0; 
   setInterval(function(){ 
    $("body").removeClass("bg1, bg2, bg3, bg4").addClass("bg"+(i++%4 + 1)); 
     }, 20000); 

 })();

});


Modifié par pete (16 Jan 2010 - 12:13)
Salut,
le souci c'est que si tu veux appliquer une fadeIn/fadeOut de JQuery sur la div body, l'effet ne s'appliquera pas uniquement sur le background, mais aussi sur le contenu du body...

Il faut faire une div à part du contenu, qui ne contient que ton background et avec un z-index plus bas que ta div de contenu (genre en position:absolute; top: 0; left: 0; z-index:1)

Et la, tu peux utiliser un truc du genre (pas testé mais ca doit ressembler à ca) :


$(document).ready(function(){ 
	(function(){
		var i = 0;  
		setInterval(function(){
			$("#background").fadeTo("normal", 0, function(){
				$("#background").removeClass("bg1, bg2, bg3, bg4").addClass("bg"+(i++%4 + 1));
				$("#background").fadeTo("normal", 1);
			});
		}, 20000);  
	})();
}); 

Modifié par avri (12 Jan 2010 - 13:31)
Hello,

pete a écrit :
Sujet résolue.
C'est un sujet. Smiley langue

Et si tu considères qu'il est [Résolu] merci de l'indiquer en éditant ton premier post et en modifiant le titre. Smiley cligne
Modifié par Heyoan (14 Jan 2010 - 21:48)