Bonjour,
 
j'essaye actuellement d'écrire un petit script qui agisse comme un slide avec des images. Je met mon code, puis décrit mon problème :
 
Voici le php (pour ceux qui ne connaisse pas le php, prenez en compte uniquement le html, ici le php ne fais rien de particulier dessus) :
        echo '<div id="slides">'; //la boite où vont défiler les images
 echo '<div id="slides_defil">';    //l'ensemble des images
 echo '<img class="slide" src="img/call_of_duty_4_modern_warfare_2.jpg" id="test1" alt="1"/>
         <img class="slide" src="img/02168120-photo-brink.jpg" id="test2" alt="2"/>
         <img class="slide" src="img/images.jpg" id="test3" alt="3"/>';
 echo '</div>';
 echo '</div>';
        echo '<script type="text/javascript">slide2();</script>';
 
Voici le js :
function slide2()
{
 var img = document.getElementById("slides_defil" );   //img correspond à l'ensemble des images
 if(img.style.marginLeft == "-1200px" )
 {
  img.style.marginLeft = "-0px";
 }
 else
 {
  img.style.marginLeft = (parseInt(img.style.marginLeft) -600) + "px";
 }
 window.setTimeout("slide2()", 1000);
}
 
 
le CSS :
#slides
{
 height:400px;
 width:600px;
 overflow:hidden;
}
.slide
{
 height:400px;
 width:600px;
}
#slides_defil     //c'est ici que le js agit
{
 width:6000px;
 color:black;
 margin-left:-0px;
}
 
 
Actuellement, le problème c'est lorsque le js veut interagir avec le CSS, j'ai fais des tests et le js ne m'affiche rien quand je met alert(img.style.marginLeft)
J'utilise Firebug, et après des tests, je peux dire que le problème survient lors du if, il m'affiche ceci (firebug) "Erreur d'analyse de la valeur pour « margin-left ». Déclaration abandonnée."
Il semble que le js n'est pas "accès" au CSS...
J'ai essayé avec doctype et sans, mais sans succès...
 
Quelqu'un a une idée ?

Tu devrais utiliser ,une lib javascript cross-browser, style Prototype.
 
Ex : http://www.prototypejs.org/api/element/getStyle
 
Comme ça, plus de bugs dus à ton code et ça passera sur tous les navigateurs (Firefox colle le 'px' à certaines propriétés, pas IE, il me semble)...

J'ai oublié de préciser que je test sous Firefox, mais je viens d'essayer sous IE et chrome, ça ne fonctionne toujours pas.  
J'essayerai la lib, mais je doute que ce soit ça le problème étant donné qu'il n'arrive même pas à lire la propriété

Tu attends bien que le document (page) soit chargée au moins?

Salut,

non ce n'est pas "ici" que le js agit, le js agit directement sur l'element, c'est a dire qu'il te fout un attribut style sur l'element html même si celui-ci est déjà régi apr des d'autres regles css.

Bref,  -0px ça ne te choque pas ?
En tout cas lui il ne connait pas
(indice : en faisant alert(img.style.marginLeft) après avoir fait  img.style.marginLeft = "-0px"; , tu obitens quoi ?)

Si tu veux sauter les problemes suis le premier conseil de rufo, une lib comme jquery te permet de faire ce genre de calculs / comparaisons directement avec des nombres, et non pas avec des comparaisons de string.
Mais on peut effectivement le faire soi meme.

ps :IE aussi rufo

 
Il me semblait que c'était que les navigateurs de la ligné de Mozilla (y compris Netscape) qui accolaient "px" dans la propriété? A mois qu'à partir d'une version de IE, ça ait changé (sous IE6, je suis presque sûr que y'a pas le px)...

Je vais test avec la lib, et je vous dis si ça marche.

le "-0px" est resté suite à des tests car j'utilisais un parseInt() et apparemment si la chaine commence par 0 il comprend qu'il doit renvoyer ça en octal.
Mais j'ai testé avec 0px, 600px et ça ne m'affichais toujours rien ^^'
 

Effectivement, là il m'affiche "0px" et ne râle pas à propos d'une erreur d'analyse... Il effectue même le script comme il faut ensuite... (mis à part que évidemment, du coup il revient à 0px à chaque fois au début du script ^^' )
Du coup, j'imagine que si j'initialisais d'une manière ou d'une autre, ça fonctionnerait...
 

Oui oui, quand même  ^^

Au final je n'ai pas utilisé prototype (notamment car je n'ai jamais utilisé de lib encore, et que je n'ai pas le temps actuellement d'y regarder de plus près, bien que ça ne tardera pas !), mais ça fonctionne.
 
Voici le js :
 
function slide()
{
 var img = document.getElementById("slides_defil" );
 img.style.marginLeft = 0;
 slide2();
}
 
function slide2()
{
 var img = document.getElementById("slides_defil" );
 if(parseInt(img.style.marginLeft) == -1200)
 {
  img.style.marginLeft = 0;
 }
 else
 {
  img.style.marginLeft = (parseInt(img.style.marginLeft) -600) + "px" ;  //aussi étrange que ça puisse paraitre, si j'enlève le px, et/ou le parseint, ça ne fonctionne plus...
 }
 window.setTimeout("slide2()", 1000);
}
 
et le code php légèrement changé à cause des marges créer par l'echo sur plusieurs lignes :
 
        echo '<div class="commun">';
 echo '<div id="slides">';
 echo '<div id="slides_defil">';
 echo '<img class="slide" src="img/call_of_duty_4_modern_warfare_2.jpg" id="test1" alt="1"/>';
 echo '<img class="slide" src="img/02168120-photo-brink.jpg" id="test2" alt="2"/>';
 echo '<img class="slide" src="img/images.jpg" id="test3" alt="3"/>';
 echo '</div>';
 echo '</div>';
 echo '</div>';
 echo '<script type="text/javascript">slide();</script>';
 
 
Et ho ! Miracle, ça fonctionne sous Chrome, IE, et FF
 
Merci pour votre aide !

J'ai amélioré mon slide (maintenant ça bouge pour de vrai ) et je me suis rendu compte de certaines "règles" enfin de comment ça fonctionne quoi, histoire que d'autres puissent s'en servir si besoin :
 
Pour donner une valeur, il faut ajouter le "px" à la fin.
ex : img.style.marginLeft = (parseInt(img.style.marginLeft) + 100) + "px";
 
Vous remarquez aussi qu'il faut utiliser un parseInt pour reprendre la valeur contenu par la propriété.
 
Donc pour un if par exemple, vous pouvez faire comme ceci :
if(parseInt(img.style.marginLeft) == -1200)
 
Ou bien :
if(img.style.marginLeft != 0 + "px" )
 
Je précise que testé sous IE 9, Chrome (v. 11.0.696.68), et FF (v. 4.0.1), tout fonctionne !

On utilise des libs justement pour s'éviter ce genre de prise de tête ...

Je sais bien, c'est juste que j'ai pas encore eu le temps de regarder, mais j'y compte bien d'ici peu !