Méthode clearQueue
La méthode clearQueue nous permet de supprimer de
la file d'attente toutes les fonctions qui n'ont pas été exécutées.
Syntaxe
Voici comment nous pouvons vider la file d'attente des fonctions. On peut passer
en paramètre optionnel le nom de la file d'attente
sous forme de chaîne (par défaut fx - file d'attente
standard des effets). Si aucun paramètre n'est passé,
toutes les fonctions restantes seront supprimées de la file d'attente fx :
.clearQueue([nom de la file d'attente]);
Cette méthode est similaire à la méthode
stop. Mais,
si cette dernière ne peut fonctionner qu'avec l'animation,
clearQueue permet de travailler avec n'importe quelle file d'attente
jQuery qui a été ajoutée par la méthode
queue.
Exemple
Lorsqu'on clique sur le bouton #start,
nous lançons l'animation. Lorsqu'on clique sur
le bouton #stop, nous arrêtons l'animation
et vidons la file d'attente à l'aide de la méthode
clearQueue. Lorsqu'on clique à nouveau sur
#start, l'animation recommence depuis le début :
<button id="start">start</button>
<button id="stop">stop</button>
<div></div>
div {
position: absolute;
margin: 3px;
width: 50px;
height: 50px;
left: 0px;
top: 30px;
background: red;
display: none;
}
div.newcolor {
background: green;
}
$('#start').click(function() {
let myDiv = $('div');
myDiv.show('slow');
myDiv.animate({
left: '+=200'
}, 5000);
myDiv.queue(function() {
let that = $(this);
that.addClass('newcolor');
that.dequeue();
});
myDiv.animate({
left: '-=200'
}, 1500);
myDiv.queue(function() {
let that = $(this);
that.removeClass('newcolor');
that.dequeue();
});
myDiv.slideUp();
});
$('#stop').click(function() {
let myDiv = $('div');
myDiv.clearQueue();
myDiv.stop();
});
