Как остановить эффект в jQuery

У меня есть страница, которая использует

$(id).show("highlight", {}, 2000);

чтобы выделить элемент при запуске ajax-запроса, который может завершиться неудачно, поэтому я хочу использовать что-то вроде

$(id).show("highlight", {color: "#FF0000"}, 2000);

в обработчике ошибок. Проблема в том, что если первая подсветка еще не закончена, вторая помещается в очередь и не запускается до тех пор, пока первая не будет готова. Отсюда вопрос: могу ли я как-то остановить первый эффект?

Ответ 1

Из документов jQuery:

http://docs.jquery.com/Effects/stop

Остановить текущую анимацию на согласованных элементах....

Когда .stop() вызывается в элементе, текущая анимация (если она есть) немедленно останавливается. Если, например, элемент скрывается с .slideUp(), когда вызывается .stop(), теперь элемент все равно будет отображаться, но будет составлять часть его предыдущей высоты. Функции обратного вызова не вызываются.

Если для одного и того же элемента вызывается несколько методов анимации, более поздние анимации помещаются в очередь эффектов для элемента. Эти анимации не начнутся до тех пор, пока не завершится первая. Когда вызывается .stop(), следующая анимация в очереди начинается немедленно. Если параметр clearQueue имеет значение true, остальные анимации в очереди удаляются и никогда не запускаются.

Если аргументу jumpToEnd предоставляется значение true, текущая анимация останавливается, но элемент сразу получает целевые значения для каждого свойства CSS. В нашем примере выше .slideUp() элемент будет немедленно скрыт. Затем функция обратного вызова немедленно вызывается, если предоставляется...

Ответ 2

Я перечислил это как комментарий для принятого ответа, но я подумал, что было бы неплохо опубликовать его как автономный ответ, поскольку он помогает некоторым людям с проблемами с .stop()

FYI - Я тоже искал этот ответ (пытаясь остановить эффект пульсации), но в моем коде у меня был .stop().

После просмотра документов мне понадобилось .stop(true, true)

Ответ 3

.stop(true, true) заморозит эффект, поэтому, если он невидим в то время, он остается невидимым. Это может быть проблемой, если вы используете эффект пульсации.

$('#identifier').effect("pulsate", {times:5}, 1000);

Чтобы обойти это, я добавил

$('#identifier').stop(true, true).effect("pulsate", { times: 1 }, 1);

Ответ 4

В моем случае использование приведенного ниже кода не работает и сохраняет значение непрозрачности:

$('#identifier').stop(true, true).effect("pulsate", { times: 1 }, 1);

Для меня просто убрать непрозрачность работают:

$('#identifier').stop(true, true).css('opacity','');