jquery FadeOut для Класса, Выполнения Многократно, вместо Одновременно, y?
У меня есть страница с этими несколькими отделениями как:
По умолчанию все - display:none, и я позволяю пользователю нажать для показа определенной карты.
Каждый раз, когда пользователь нажимает для загрузки карты, я запускаю следующий JQUERY:
$('.carditem').fadeOut( function() {alert(1)
// Animation complete show correct card
$('#' + toogleID).fadeIn();
});
То, что удивляет меня, - то, что предупреждение выше происходит 5 раз, не в 1 раз. Значение постепенного исчезновения не работает Одновременно, но цикличное выполнение по всем объектам карты. Это делает для ужасной анимации, которая мигает. Как я могу заставить постепенное исчезновение для всех классов соответствия работать одновременно? Или просто работавший классы, которые имеют отделения, которые отображаются, который должен только быть 1 картой?
Спасибо!
1 ответ
Если вы уберете предупреждение, которое останавливает анимацию (вызывая смещенный старт), она будет вести себя как ожидалось, по крайней мере, с точки зрения того, что начальные анимации будут одновременными.:
$('.carditem:visible').fadeOut( function() {
$('#' + toogleID).fadeIn();
});
Каждый элемент делает анимацию независимо, если вы хотите, чтобы . fadeIn() произойдет после последнего из них, то проверьте, анимирован ли еще какой-нибудь элемент с помощью .is() и селектора :animated, вот так:
$('.carditem:visible').fadeOut( function() {
if(!$('.carditem').is(':animated')) //are any still animating?
$('#' + toogleID).fadeIn();
});
Добавление :visible к селектору сделано для того, чтобы только видимые элементы затухали, а не показывались/затухали все.