[javascript]Transmition de paramétre
Shanamir
-
Mimiste Messages postés 1149 Date d'inscription Statut Membre Dernière intervention -
Mimiste Messages postés 1149 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je suis entrain de coder un diaporama en javascript.
Mon algorithme est assez simple :
Quand : click sur l'image -> mise en route de la fonction diapo ->agit sur la visibilité de l'image
Mon premier srcipt ressemble à ça :
<script type="text/JavaScript">
<!--
function diapo() {
document.getElementById("diapo1").style.visibility = 'hidden';
document.getElementById("diapo2").style.visibility = 'visible';
document.getElementById("diapo3").style.visibility = 'hidden';
}
//-->
</script>
<html>
<div id="diapo1" style="visibility:visible"><img src="images/normal/image1.jpg"width="299" height="305"></div>
<div id="diapo2" style="visibility:hidden" ><img src="images/normal/image2.jpg"width="299" height="305"></div>
<div id="diapo3" style="visibility:hidden"><img src="images/normal/image3.jpg"width="299" height="305"></div>
<a href="#" onClick="diapo()"> <img src="images/reduite/image2.jpg" width="112" height="75" ></a>
</html>
Ce script marche très bien mais son seul défaut réside dans la multiplication des lignes javascript et des fonctions, en gros une fonction par image...
Ce que je voudrai pouvoir mettre en place c'est une seul fonction qui récupère les ID des photos concernées pour pouvoir les rendre visible et invisible :
<script type="text/JavaScript">
<!--
function diapo('img1', 'img2', 'img3') {
document.getElementById("img1").style.visibility = 'visible';
document.getElementById("img2").style.visibility = 'hidden';
document.getElementById("img3").style.visibility = 'hidden';
}
//-->
</script>
<html>
<div id="diapo1" style="visibility:visible"><img src="images/normal/image1.jpg"width="299" height="305"></div>
<div id="diapo2" style="visibility:hidden" ><img src="images/normal/image2.jpg"width="299" height="305"></div>
<div id="diapo3" style="visibility:hidden"><img src="images/normal/image3.jpg"width="299" height="305"></div>
<a href="#" onClick="diapo('diapo2', 'diapo1', 'diapo3')"> <img src="images/reduite/image2.jpg" width="112" height="75" ></a>
</html>
Comme on peut le voir le nom des ID concernés est transmit à la fonction qui les gères en fonction de leur place. Seul problème il semble que la transmition ne se fasse pas...
Une idée ?
Je suis entrain de coder un diaporama en javascript.
Mon algorithme est assez simple :
Quand : click sur l'image -> mise en route de la fonction diapo ->agit sur la visibilité de l'image
Mon premier srcipt ressemble à ça :
<script type="text/JavaScript">
<!--
function diapo() {
document.getElementById("diapo1").style.visibility = 'hidden';
document.getElementById("diapo2").style.visibility = 'visible';
document.getElementById("diapo3").style.visibility = 'hidden';
}
//-->
</script>
<html>
<div id="diapo1" style="visibility:visible"><img src="images/normal/image1.jpg"width="299" height="305"></div>
<div id="diapo2" style="visibility:hidden" ><img src="images/normal/image2.jpg"width="299" height="305"></div>
<div id="diapo3" style="visibility:hidden"><img src="images/normal/image3.jpg"width="299" height="305"></div>
<a href="#" onClick="diapo()"> <img src="images/reduite/image2.jpg" width="112" height="75" ></a>
</html>
Ce script marche très bien mais son seul défaut réside dans la multiplication des lignes javascript et des fonctions, en gros une fonction par image...
Ce que je voudrai pouvoir mettre en place c'est une seul fonction qui récupère les ID des photos concernées pour pouvoir les rendre visible et invisible :
<script type="text/JavaScript">
<!--
function diapo('img1', 'img2', 'img3') {
document.getElementById("img1").style.visibility = 'visible';
document.getElementById("img2").style.visibility = 'hidden';
document.getElementById("img3").style.visibility = 'hidden';
}
//-->
</script>
<html>
<div id="diapo1" style="visibility:visible"><img src="images/normal/image1.jpg"width="299" height="305"></div>
<div id="diapo2" style="visibility:hidden" ><img src="images/normal/image2.jpg"width="299" height="305"></div>
<div id="diapo3" style="visibility:hidden"><img src="images/normal/image3.jpg"width="299" height="305"></div>
<a href="#" onClick="diapo('diapo2', 'diapo1', 'diapo3')"> <img src="images/reduite/image2.jpg" width="112" height="75" ></a>
</html>
Comme on peut le voir le nom des ID concernés est transmit à la fonction qui les gères en fonction de leur place. Seul problème il semble que la transmition ne se fasse pas...
Une idée ?
A voir également:
- [javascript]Transmition de paramétre
- Remettre parametre usine pc - Guide
- Parametre dns - Guide
- Parametre windows - Guide
- Netflix paramètre compte - Guide
- Parametre usine chromecast - Guide
2 réponses
Hello
Non effectivement ça ne peux pas marcher car il ne faut pas mettre de guillemets, ce sont des variables et pas des chaine
<script type="text/JavaScript">
<!--
function diapo(img1, img2, img3) {
document.getElementById(img1).style.visibility = 'visible';
document.getElementById(img2).style.visibility = 'hidden';
document.getElementById(img3).style.visibility = 'hidden';
}
//-->
</script>
Ceci dis, je ne pense pas que ce soit la meilleure méthode non plus, c'est assez figé comme principe
Non effectivement ça ne peux pas marcher car il ne faut pas mettre de guillemets, ce sont des variables et pas des chaine
<script type="text/JavaScript">
<!--
function diapo(img1, img2, img3) {
document.getElementById(img1).style.visibility = 'visible';
document.getElementById(img2).style.visibility = 'hidden';
document.getElementById(img3).style.visibility = 'hidden';
}
//-->
</script>
Ceci dis, je ne pense pas que ce soit la meilleure méthode non plus, c'est assez figé comme principe