Utilisation de jquery pour basculer entre différentes fonctions et ne pas reprendre à l'endroit où elle est restée

Le code de la première fonction affiche trois divs différents sur des intervalles spécifiques de 5 secondes (div1, div2, div3).
Le code de la deuxième fonction utilisé pour arrêter d'afficher les divs.

tout en montrant div2, j'ai cliqué sur le lien pour arrêter à ce point il s'est arrêté.
Mais après ça je l'ai cliqué à nouveau et ça montre div1 (ça va bien basculer) mais je voudrais continuer la prochaine action qui devait montrer div3.
Utilisation de jquery pour basculer entre différentes fonctions et ne pas reprendre à l'endroit où elle est restée

code Jquery:

$(function() { 

var IntervalId; 

function first_function() { 
var counter = 0, 
divs = $('#div1,#div2,#div3'); 
function showDiv() { 
      divs.hide() // hide all divs 
      .filter(function (index) { return index == counter % 3; }) 
      .show('fast'); // and show it 
      counter++; 
}; 
showDiv();  
IntervalId = setInterval(showDiv, 5000); 
}; 

function second_function(){ 
    clearInterval(IntervalId); 
} 

$("#link1").toggle(
first_function,second_function 
); 

});

Html Code:

<a href="javascript:void(0);" id="link1">Toggle</a>

Source

2009-05-29 Webrsk

déplacer l'initialisation du compteur extérieur first_function():

$(function() { 

var IntervalId; 
var counter = 0, 

function first_function() { 
divs = $('#div1,#div2,#div3'); 
...

Dans votre exemple, chaque fois que vous appelez first_function(), le compteur est remis à zéro.

Source

2009-05-29 07:25:48

Amusez-vous avec:

<script type="text/javascript"> 
$(function() { 
    var divFunctions = []; 
    var $divs = $('#div1,#div2,#div3'); 

    $divs.each(function() { 
    var $this = $(this); 
    divFunctions.push(function() { 
     return function() { 
     $divs.not($this).hide(); 
     $this.show("fast") 
     }; 
    }()); 
    }); 

    var $toggle_button = $("#link1"); 
    $toggle_button.toggle.apply($toggle_button, divFunctions); 
}); 
</script> 

<body> 
    <a href="javascript:void(0);" id="link1">Toggle</a> 

    <div id='div1' style="display:none;">content1</div> 
    <div id='div2' style="display:none;">content2</div> 
    <div id='div3' style="display:none;">content3</div> 
</body>

Source

2009-05-29 12:38:10 Tomalak

Utilisation de jquery pour basculer entre différentes fonctions et ne pas reprendre à l'endroit où elle est restée

Répondre

Questions connexes