11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous ! Smiley smile

Je cherche à faire un petit diaporama sur mon site, sur la page d'accueil...

J'ai ce code en JavaScript :

<script type="text/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);
   }
}
</script>



Et celui-ci en xHTML (m'embêtez pas avec les balises CSS qui sont encore là, je les mettrai dans le CSS quand ça marchera Smiley langue )

<div id="Diaporama">
 
<form name=slideform>
 
<table>
<tr>
<td width=600 height=180>
<img style="height: 150px; width: 200px" src="/P1030009.JPG" name="show">       </td>
</tr>
 
<tr>
<td>
<select name="slide" onChange="change();">
<option value="/P1030009.JPG">N°1
<option value="/P1030010.JPG">N°2
<option value="/P1030016.JPG">N°3
<option value="/P1030022.JPG">N°4
<option value="/P1030034.JPG">N°5
</select>
                                                                                <input type=button onClick="first();" value="Début" title="Début">
<input type=button onClick="previous();" value="Précédent" title="Précédent">
<input type=button name="slidebutton" onClick="ap(this.value);" value="Commencer" title="AutoPlay">
<input type=button onClick="next();" value="Suivant" title="Suivant">
<input type=button onClick="last();" value="Fin" title="Fin">
</td>
</tr>
</table>
</form>
</div>


Et je voudrais que les photos défilent automatiquement Smiley cligne Merci de m'aider si vous avez une idée Smiley lol

Merci et bonne soirée à tous Smiley biggrin