11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous, comme dis dans le titre ma question concerne l'effet fadeIn de jQuery dont je me sert pour faire un petit diaporama.
Et comme souvent (pour ne pas dire comme d'hab' ^^) j'ai un probleme avec ie8, le diapo fonctionne très bien mais je n'ai aucun changement d'opacité.
Aprés quelques recherche j'ai essayer iepngfix (malgrés que j'utilise des jpg) en supposant que la fonction fadeIn() transorme les images en png mais sans succes.
Merci d'avance !!

Mon code

Js (complet):
$(function(){
	 var grand = $('#fulldiap'); i=1;
	 function diapo(){
		     xy = setInterval(function(){//interval de 5s entre chaque photos
			 var pti = $('#list article img:eq('+ i++ +')');//selectionne la balise suivante
			 grand.fadeOut('slow',function(){//fait disparaitre #fulldiap
				 grand.empty();//vide la balise #fulldiap
				 pti.clone().prependTo(grand);//Copie la petite image dans #fulldiap
				 grand.fadeIn('slow');//fait apparaitre #fulldiap
				 if(i == 6){//A la derniere image le compteur se remet a zero
					 i = 0;
				 } 
			 });
		 }, 5000);
	 }
	 diapo();//execute la fonction au chargement
	 $('#list article img').click(function(){
		 var pti = $(this);//recupere l'image cliqué
		 grand.fadeOut('fast', function(){
			 grand.empty();
			 pti.clone().prependTo(grand);
			 grand.fadeIn('normal');
			 clearInterval(xy);//stop l'interval
			 setTimeout(function(){diapo();}, 10000);//reprend l'interval 10s aprés
		 });
	 });
});


Et le html(juste le diapo) :

<section id="diap">

   <section id="fulldiap">
      <img src="FILES/001.jpg"/>
   </section>

   <section id="list">
      <article>
         <img src="FILES/001.jpg" />
      </article>
      <article>
         <img src="FILES/002.jpg" />
      </article>
      <article>
          <img src="FILES/003.jpg" />
      </article>
      <article>
          <img src="FILES/004.jpg" />
      </article>
      <article>
          <img src="FILES/005.jpg" />
      </article>
      <article>
          <img src="FILES/006.jpg" />
      </article>
   </section>
</section>


Un exemple en ligne : Ici
PS : les images sont deformées c'est normal, juste le temps du test rassurer vous ^^
Modifié par colegos (20 Dec 2011 - 15:57)