[Function] clearQueue()
Раздел "Data"
Метод удаляет все элементы очереди, которые до момента запуска данной функции не были выполнены.
queueName: строка, содержащая название очереди, по умолчанию fx, данный метод удаляет все методы.
При вызове данного метода все функции, которые до этого не были выполнены будут удалены из очереди выполнения функций. Когда метод .clearQueue() применяется без аргументов он становится аналогом метода .stop(true). Однако в отличие от последнего данный метод позволяет работать не только с методами использующими анимацию, но и для удаления любых других функций установленных в очередь с помощью метода .queue().
Пример:
"jQuery"
$("#start").click(function () {
$("div").show("slow");
$("div").animate({left:'+=200'},5000);
$("div").queue(function () {
$(this).addClass("newcolor");
$(this).dequeue();
});
$("div").animate({left:'-=200'},1500);
$("div").queue(function () {
$(this).removeClass("newcolor");
$(this).dequeue();
});
$("div").slideUp();
});
$("#stop").click(function () {
$("div").clearQueue();
$("div").stop();
});
"HTML"
<body>
<button id="start">Start</button>
<button id="stop">Stop</button>
"CSS"
div { margin:3px; width:40px; height:40px;
position:absolute; left:0px; top:30px;
background:green; display:none; }
div.newcolor { background:blue; }
"Живой пример jQuery"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="http://test-drupal.ru/themes/slyweb/css/jqueryiframe.css"
rel="stylesheet" type="text/css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#start").click(function () {
$("div").show("slow");
$("div").animate({left:'+=200'},5000);
$("div").queue(function () {
$(this).addClass("newcolor");
$(this).dequeue();
});
$("div").animate({left:'-=200'},1500);
$("div").queue(function () {
$(this).removeClass("newcolor");
$(this).dequeue();
});
$("div").slideUp();
});
$("#stop").click(function () {
$("div").clearQueue();
$("div").stop();
});
});
</script>
</head>
<body class="iframe">
<body>
<button id="start">Start</button>
<button id="stop">Stop</button>
</body>
</html>
<style>
div { margin:3px; width:40px; height:40px;
position:absolute; left:0px; top:30px;
background:green; display:none; }
div.newcolor { background:blue; }
</style>
Версия jQuery 1.4.2
Документ создан 2010-08-21