Метод stop

Методът stop ни позволява незабавно да спрем стартирана анимация. Анимацията ще продължи вече от следващата функция без да завърши предишната.

Синтаксис

Така спираме стартирана анимация. Може да подадете два незадължителни параметъра, които приемат Булеви стойности. Ако първият параметър се зададе като true, тогава останалите функции в опашката за анимация ще бъдат изтрити и никога няма да стартират. Ако вторият параметър се зададе на true, тогава при спиране на анимацията css-свойствата на елемента незабавно ще приемат своите крайни стойности (т.е., ако целта е плавно скриване на елемента, той ще бъде скрит мигновено):

.stop([clearQueue], [jumpToEnd]);

Може също да подадете незадължителен параметър, в който се посочва името на опашката:

.stop([име на опашката], [clearQueue],[jumpToEnd]);

Анимацията може да бъде изключена глобално, като се използва настройката jQuery.fx.off = true, която задава стойност на продължителността на 0.

Пример

Нека направим така, че при всяко кликване върху бутона #toggle нашият правоъгълник да се разгъва и да се свива с помощта на метода slideToggle. Натискайте бутона, без да чакате завършването на анимацията - следващият етап ще се стартира, без да чака завършването на предишния, благодарение на метода stop:

<button id="toggle">toggle</button>
<div id="test"></div>

#test {
	background-color: green;
	border: 1px solid black;
	width: 200px;
	height: 100px;
	margin: 10px;
}

$('#toggle').on('click', function() {
	$('#test').stop().slideToggle(1500);
});

Вижте също

метод clearQueue,
който позволява да се изтрият всички неизпълнени елементи от опашката от функции
свойство jQuery.fx.off,
което позволява глобално изключване на анимацията