Comment afficher 2 calques EN MEME TEMPS avec 2 menus déroulants?

Comment afficher 2 calques EN MEME TEMPS avec 2 menus déroulants? - HTML/CSS - Programmation

Marsh Posté le 30-06-2006 à 11:05:01    

Salut
 
J'ai ce script sous la main et voilà mon probleme: quand on affiche un calque avec le 1er menu déroulant, il disparait quand affiche un autre calque avec le 2ème menu déroulant. Donc je voudrais savoir comment faire pour que le calque du premier menu déroulant reste affiché à l'ecran quand on affiche le second calque avec l'autre menu déroulant (en gros je veux voir à l'ecran les 2 calques en même temps). Merci d'avance   ;)  
 

Code :
  1. <HTML>
  2. <HEAD>
  3. <SCRIPT LANGUAGE="JavaScript">
  5. var encours="";
  6. function AffLayer1(liste) {
  7.         var nomlayer=liste.options[liste.selectedIndex].value;
  8.         if (document.all) {
  9.                 if (encours!="" ) {document.all[encours].style.visibility="hidden";}
  10.                 encours=nomlayer;
  11.                 if (nomlayer!="" ) {document.all[encours].style.visibility="visible";}
  12.         }
  13.         if (document.layers) {
  14.                 if (encours!="" ) {document.layers[encours].visibility="hide";}
  15.                 encours=nomlayer;
  16.                 if (nomlayer!="" ) {document.layers[encours].visibility="show";}
  17.         }
  18.         if (document.getElementById) {
  19.                 if (encours!="" ) {document.getElementById(encours).style.visibility="hidden";}
  20.                 encours=nomlayer;
  21.                 if (nomlayer!="" )
  23. {document.getElementById(encours).style.visibility="visible";}
  24.         }
  25. }
  27. </SCRIPT>
  29. <SCRIPT LANGUAGE="JavaScript">
  31. var encours="";
  32. function AffLayer2(liste) {
  33.         var nomlayer=liste.options[liste.selectedIndex].value;
  34.         if (document.all) {
  35.                 if (encours!="" ) {document.all[encours].style.visibility="hidden";}
  36.                 encours=nomlayer;
  37.                 if (nomlayer!="" ) {document.all[encours].style.visibility="visible";}
  38.         }
  39.         if (document.layers) {
  40.                 if (encours!="" ) {document.layers[encours].visibility="hide";}
  41.                 encours=nomlayer;
  42.                 if (nomlayer!="" ) {document.layers[encours].visibility="show";}
  43.         }
  44.         if (document.getElementById) {
  45.                 if (encours!="" ) {document.getElementById(encours).style.visibility="hidden";}
  46.                 encours=nomlayer;
  47.                 if (nomlayer!="" )
  49. {document.getElementById(encours).style.visibility="visible";}
  50.         }
  51. }
  53. </SCRIPT>
  55. </HEAD>
  57. <BODY>
  59. <FORM>
  60. <SELECT NAME="liste" onChange='AffLayer1(this)'>
  61.         <option value="">Choisir un calque</option>
  62.         <option value="layer1">Voiture</option>
  63.         <option value="layer2">Animaux</option>
  64.         <option value="layer3">Maison</option>
  65. </SELECT>
  67. </FORM>
  69. <DIV id="layer1" style="position:absolute;left:200px;top:100px;z-index:1;visibility:hidden">
  70.   Voiture
  71. </DIV>
  73. <DIV id="layer2" style="position:absolute;left:500px;top:300px;z-index:1;visibility:hidden">
  74.   Animaux
  75. </DIV>
  77. <DIV id="layer3" style="position:absolute;left:700px;top:400px;z-index:1;visibility:hidden">
  78.   Maison
  79. </DIV>
  82. <FORM>
  83. <SELECT NAME="liste" onChange='AffLayer2(this)'>
  84.         <option value="">Choisir un calque</option>
  85.         <option value="layer4">nettoyage</option>
  86.         <option value="layer5">travail</option>
  87.         <option value="layer6">informatique</option>
  88. </SELECT>
  90. </FORM>
  92. <DIV id="layer4" style="position:absolute;left:300px;top:600px;z-index:2;visibility:hidden">
  93.   Nettoyage
  94. </DIV>
  96. <DIV id="layer5" style="position:absolute;left:200px;top:500px;z-index:2;visibility:hidden">
  97.   Travail
  98. </DIV>
  100. <DIV id="layer6" style="position:absolute;left:450px;top:550px;z-index:2;visibility:hidden">
  101.   Informatique
  102. </DIV>
  105. </BODY></HTML>


 

Reply

Marsh Posté le 30-06-2006 à 11:05:01   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed