2010-07-04 8 views
0

j'ai fait un code pour montrer seulement un div et auto cacher le div après x secondes il a travaillé pour la première fois seulement après que ............ ........ est ici le codeauto masquer div après 2 secondes

<script type="text/javascript"> 

function showonlyone(thechosenone) { 
     var newboxes = document.getElementsByTagName("div"); 
      for(var x=0; x<newboxes.length; x++) { 
        name = newboxes[x].getAttribute("name"); 
        if (name == 'newboxes') { 
         if (newboxes[x].id == thechosenone) { 
         newboxes[x].style.display = 'block'; 
        } 
        else { 
         newboxes[x].style.display = 'none'; 
        } 
      } 
     } 
} 
function hidediv(arg) { 
    document.getElementById(arg).style.display = 'none'; 
} 
setTimeout("hidediv('newboxes1')", 4000); 
setTimeout("hidediv('newboxes2')", 4000); 
setTimeout("hidediv('newboxes3')", 4000); 
</script> 
<div style="float:left;padding-left:5px;padding-right:5px;" > 
     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;"> 
      <a id="myHeader1" href="javascript:showonlyone('newboxes1');" >collapse</a> 
     </div> 
     <div name="newboxes" id="newboxes1" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px;">Div #1</div> 
    </div> 
    <div style="float:left;padding-left:5px;padding-right:5px;" > 
     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;"> 
      <a id="myHeader2" href="javascript:showonlyone('newboxes2');" >collapse</a> 
     </div> 
     <div name="newboxes" id="newboxes2" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px;">Div #2</div 
    </div> 
    <div style="float:left;padding-left:5px;padding-right:5px;" > 
     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px;"> 
      <a id="myHeader3" href="javascript:showonlyone('newboxes3');" >collapse</a> 
     </div> 
     <div name="newboxes" id="newboxes3" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px;">Div #3</div 
    </div> 
+0

IIRC l'attribut name est pas valide sur un élément DIV, seules les formes, les contrôles de formulaire, (i) les cadres et les points d'ancrage ... A la classe pourrait fonctionner un peu mieux (et aussi fournir un crochet pratique pour le style) – scunliffe

Répondre

2

utilisation setInterval au lieu de setTimeout

ex:

setInterval(function(){ hidediv('newboxes1');}, 4000); 
setInterval(function(){ hidediv('newboxes2');}, 4000); 
setInterval(function(){ hidediv('newboxes3');}, 4000); 
0

mieux vous déboguer le code. Vous pouvez installer firebug pour firefox. C'est un très bon outil pour trouver des erreurs JS.

Questions connexes