[Javascript] Problème slider sur GoogleChrome

Résolu
-  
Anoen Messages postés 196 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

J'ai développé un slider afin de pouvoir faire défiler quelques images sur mon site (vous pouvez aller jeter un oeil sur http://www.generic-provider.ch/index.php?page=home ), il fonctionne très bien sur la majorité des navigateurs excepté Google Chrome (je n'ai pas eu l'occasion de le tester sur Safari mais je pense que le problème est le même...) ou les images ne veulent pas défiler...

Vous pourrez trouver le code .js qui fait défiler les images à cette adresse:
http://www.generic-provider.ch/tri/data/scripts/slider.js

Et voici le slider en html ainsi que le css (je n'ai affiché qu'une partie du code, vous pourrez trouver le code complet en allant voir le lien que je vous ai donné):
<div id="slider">   
    <div id="gallery" style="margin-left:0px;width:720px;">  
        <a href=""><img src="./data/img/Images/slider/comp/Formamed_0275.jpg" border="0"/></a>  
        <a href=""><img src="./data/img/Images/slider/comp/Formamed_0081.jpg" border="0"/></a>  
        <a href=""><img src="./data/img/Images/slider/comp/Formamed_0152.jpg" border="0"/></a>  
        <a href=""><img src="./data/img/Images/slider/comp/Formamed_0173.jpg" border="0"/></a>  
        <a href=""><img src="./data/img/Images/slider/comp/Formamed_0180.jpg" border="0"/></a>  
    </div>  
 <script type='text/javascript'>  
        onLoading(720,"gallery",true);  
    </script>  
</div>   

#slider{   
background-color:#999;   
width:720px;   
height:400px;   
margin:0;   
position:relative;  
overflow:hidden;  
}  
#gallery{   
-webkit-transition: all 1.5s ease-in-out;  
-moz-transition: all 1.5s ease-in-out;  
-o-transition: all 1.5s ease-in-out;  
-ms-transition: all 1.5s ease-in-out;  
transition: all 1.5s ease-in-out;  
overflow:hidden;  
}   
#gallery img{  
float:left;  
height:400px;  
width:720px;  
}   


J'ai cherché un peu et le problème vient apparemment lorsque j'essaie de changer le marginLeft dans le code javascript pour changer d'image mais je ne vois pas comment régler le problème...

Si vous avez besoin de plus d'explications sur le code ou quoi que ce soit, n'hésitez pas!

Merci d'avance pour votre aide!
A voir également:

3 réponses


 
Bon j'ai finalement réussi à trouver mon erreur!
En effet, le script fonctionnait tout correctement, le problème venait seulement de mon code HTML, plus précisément de la balise "<center>" (qui est désapprouvée par W3C et ils conseillent de ne plus l'utiliser (shame on me!)) qui me centrait tout ce qui était entre deux, y compris les images du slider ce qui apparemment créait une erreur sur chrome et l'empêchait de déplacer ma marge lors du défilement de l'image...

Morale de la leçon :
Respecter les normes et utiliser un code propre et juste est important pour permettre le bon fonctionnement et pour ne pas perdre trop de temps ^^

Merci encore pour ton aide Anoen!
Bye
1
Anoen Messages postés 196 Date d'inscription   Statut Membre Dernière intervention   25
 
Il n'a pas l'air d'avoir de problèmes au niveau du script en revanche tes images sont introuvables !

"Failed to load resource http://www.generic-provider.ch/data/img/Images/slider/comp/Formamed_0081.jpg"
0
Anoen Messages postés 196 Date d'inscription   Statut Membre Dernière intervention   25
 
Exactement ;)
0