Conflit entre 2 code javascript

Résolu
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009
-
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009
-
salut, voici mon code javascript pour visionner des image, le problème
est que du moment que j'inclut une 2e visionneuse plus rien ne marche,
il y a un conflit quelque part mais ou ?   Merci d'avance


<head><SCRIPT LANGUAGE="JavaScript">

var rotate_delay = 5000;

current = 0;

function next() {

if (document.slideform.slide[current+1]) {

document.images.show.src = document.slideform.slide[current+1].value;

document.slideform.slide.selectedIndex = ++current;

   }

else first();

}

function previous() {

if (current-1 >= 0) {

document.images.show.src = document.slideform.slide[current-1].value;

document.slideform.slide.selectedIndex = --current;

   }

else last();

}

function first() {

current = 0;

document.images.show.src = document.slideform.slide[0].value;

document.slideform.slide.selectedIndex = 0;

}

function last() {

current = document.slideform.slide.length-1;

document.images.show.src = document.slideform.slide[current].value;

document.slideform.slide.selectedIndex = current;

}

function ap(text) {

document.slideform.slidebutton.value (text "Stop") ? "Start" : "Stop";

rotate();

}

function change() {

current = document.slideform.slide.selectedIndex;

document.images.show.src = document.slideform.slide[current].value;

}

function rotate() {

if (document.slideform.slidebutton.value == "Stop") {

current (current document.slideform.slide.length-1) ? 0 : current+1;

document.images.show.src = document.slideform.slide[current].value;

document.slideform.slide.selectedIndex = current;

window.setTimeout("rotate()", rotate_delay);

   }

}

//  End -->

</script></head>


<form name=slideform>

Image Slideshow,

----

,

----

<select name="slide" onChange="change();">

<option value="image/bolide/camionchevrolet1954-1.jpg" selected>Nom de l'image 1

<option value="image/bolide/camionchevrolet1954-2.jpg">Nom de l'image 2

<option value="image/bolide/camionchevrolet1954-3.jpg">Nom de l'image 3

<option value="image/bolide/camionchevrolet1954-4.jpg">Nom de l'image 4

<option value="image/bolide/camionchevrolet1954-5.jpg">Nom de l'image 5

<option value="image/bolide/camionchevrolet1954-6.jpg">Nom de l'image 6

</select>,

----

>" title="Next">

>|" title="End">


</form>


<form name=slideform>

Image Slideshow,

----

,

----

<select name="slide" onChange="change();">

<option value="image/bolide/camioninternational1941-1" selected>Nom de l'image 1

<option value="image/bolide/camioninternational1941-2">Nom de l'image 2

<option value="image/bolide/camioninternational1941-3">Nom de l'image 3

<option value="image/bolide/camioninternational1941-4">Nom de l'image 4

<option value="image/bolide/camioninternational1941-5">Nom de l'image 5

</select>,

----

>" title="Next">

>|" title="End">


</form>

9 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
B
onjour...
tu as 2 FORM avec le même name et pareil pour le SELECT ou l'IMG destination ce qui ne peut pas fonctionner.
mets plutôt des ID aux FORMs aux IMGs et aux SELECTs différent les atteindre grâce à un document.getElementById('id') bien plus W3C.
l'idée et de faire passer en paramètre les objets source et destination
//---------------------------
function change( this_, img_){
  var O_Ddest = document.getElementById( img_);
  current = this_.selectedIndex;
  O_Dest.src = this_[current].value;
}
avec une déclaration dans le document du type

<select id="s_slide_1" name="s_slide_1" onChange="change( this, 'img_1');">
et ainsi de suite
pour les autres fonctions idem...
//------------------------
function next( sel_, img_){

  var O_Srce = document.getElementById( sel_);

  var O_Ddest = document.getElementById( img_);





   { 
   ...
   }
  else first( sel_, img_);
}

et appel

voila pour une ébauche...
reprend ton code avec un seul slide et quand il tournera tu pourras en ajouter autant que tu veux...
Bonn Prog
;0)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Tu as de la chance ma cafetière est entartrée alors...

//------------------------
function next( sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index = O_Srce.selectedIndex +1;
  if( Index < O_Srce.length){
    O_Dest.src = O_Srce[Index].value;
    O_Srce.selectedIndex = Index;
  }
  else
    first( sel_, img_);
}
//----------------------------
function previous( sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index = O_Srce.selectedIndex -1;
  if( Index > -1){
    O_Dest.src = O_Srce[Index].value;
    O_Srce.selectedIndex = Index;
  }
  else
    last( sel_, img_);
}
//------------------------
function first(sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  O_Dest.src = O_Srce[0].value;
  O_Srce.selectedIndex = 0;
}
//-----------------------
function last(sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index  = O_Srce.length -1;
  O_Dest.src = O_Srce[Index].value;
  O_Srce.selectedIndex = Index;
}

avec appel
onClick="first   ('slide_1', 'img_1');"
onClick="previous('slide_1', 'img_1');"
onClick="next    ('slide_1', 'img_1');"
onClick="last    ('slide_1', 'img_1');"

le reste sera un jeu d'enfant

;0)
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009

J'avoue que je ne suis un bolé la dedans, j'ai essayer et sa ne marche pas même avec juste une visionneuse sa ne tourne plus. Voici le code de la page au complet avec les modifation, si j'ai bien fait, il me manque des choses peut-être ??? :

<head><SCRIPT LANGUAGE="JavaScript">
var rotate_delay = 5000;
current = 0;
function next( sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index = O_Srce.selectedIndex +1;
  if( Index < O_Srce.length){
    O_Dest.src = O_Srce[Index].value;
    O_Srce.selectedIndex = Index;
  }
  else
    first( sel_, img_);
}
function previous( sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index = O_Srce.selectedIndex -1;
  if( Index > -1){
    O_Dest.src = O_Srce[Index].value;
    O_Srce.selectedIndex = Index;
  }
  else
    last( sel_, img_);
}
function first(sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  O_Dest.src = O_Srce[0].value;
  O_Srce.selectedIndex = 0;
}
function last(sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index  = O_Srce.length -1;
  O_Dest.src = O_Srce[Index].value;
  O_Srce.selectedIndex = Index;
}
function ap(text) {document.slideform.slidebutton.value (text "Stop") ? "Start" : "Stop";
rotate();
}
function change( this_, img_){
  var O_Ddest = document.getElementById( img_);
  current = this_.selectedIndex;
  O_Dest.src = this_[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {current (current document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout("rotate()", rotate_delay);
   }
}
//  End -->
</script></head>

<form name=slideform>
Image Slideshow,

----

,

----

<select id="s_slide_1" name="s_slide_1" onChange="change( this, 'img_1');">
<option value="image/bolide/camionchevrolet1954-1.jpg" selected>Nom de l'image 1
<option value="image/bolide/camionchevrolet1954-2.jpg">Nom de l'image 2
<option value="image/bolide/camionchevrolet1954-3.jpg">Nom de l'image 3
<option value="image/bolide/camionchevrolet1954-4.jpg">Nom de l'image 4
<option value="image/bolide/camionchevrolet1954-5.jpg">Nom de l'image 5
<option value="image/bolide/camionchevrolet1954-6.jpg">Nom de l'image 6
</select>,

----

>" title="Next">
>|" title="End">

</form>
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009

J'au réussi à le fair marcher, mais la seul fonction qui marche pas c'est la fonction automatique :


>" title="Next">
>|" title="End">

Merci  
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009

Salut, y a t'il quelqu'un qui peut m'aider S.V.P, pour réparer cette fonction qui ne marche pas.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
B



onjour...
Pour finir ton diaporama on peut définir une fonction de lancement comme ceci
//--------------------------------
function lance( this_, sel_, img_){
  if( this_.value=="Start"){
    this_.value = "Stop"
    rotate( sel_, img_);
  }
  else{
    var Obj = document.getElementById( sel_);
    //-- le TimeOut est défini dans la fonction rotate
    if( Obj.TimeOut)
      clearTimeout(Obj.TimeOut);
    this_.value = "Start"
  }
}
cette fonction remplace ta fonction ap()

et on redefinie la fonction rotate comme ceci par exemple
//--------------------------
function rotate( sel_, img_){
  var O_Srce = document.getElementById( sel_);
  var O_Dest = document.getElementById( img_);
  var Index = O_Srce.selectedIndex +1;
  if( Index < O_Srce.length){
    O_Dest.src = O_Srce[Index].value;
    O_Srce.selectedIndex = Index;
  }
  else
    first( sel_, img_);
  //-- Rappel de la fonction
  O_Srce.TimeOut = setTimeout("rotate('" +sel_ +"','" +img_ +"')", 1000);
}
elle ressemble à la fonction next()

l'appel pour lancer en automatique ce faisant ainsi

Nota :
les fonctions ap() et change() ne servent plus

;0)
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009

Merci beaucoup, ça marche à merveille, en core Merci
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Heureux que cela fonctionne et 1000 excuses pour le retard à la réponse du à la trêve de NOEL...
Merci également d'accepter la réponse pour d'autres visiteurs...
...et bien sur Bonnes FETES de fin d'ANNEE !!!!
;0)
Messages postés
25
Date d'inscription
lundi 4 décembre 2006
Statut
Membre
Dernière intervention
14 novembre 2009

si vous voulez voir se que sa donne voici l'adresse : http://www.leclanalucky.com/bolide.html

et encore Merci.....