Как узнать с помощью jQuery, если элемент анимируется?
Я пытаюсь переместить некоторые элементы на странице, и во время анимации я хочу, чтобы "overflow:hidden" применялся к элементу, а "overflow" возвращался к "auto" после завершения анимации.
Я знаю, что jQuery имеет функцию полезности, которая определяет, анимируется ли какой-либо элемент, но я не могу найти его нигде в docs
5 ответов:
if( $(elem).is(':animated') ) {...}
Подробнее: http://docs.jquery.com/Selectors/animated
или:
$(elem) .css('overflow' ,'hidden') .animate({/*options*/}, function(){ // Callback function $(this).css('overflow', 'auto'); };
кроме того, чтобы проверить, если что-то не анимированные, вы можете просто добавить "!":
if (!$(element).is(':animated')) {...}
Если вы хотите применить css к анимированным элементам, вы можете использовать
:animated
псевдо селектор и сделать это так,$("selector").css('overflow','hidden'); $("selector:animated").css('overflow','auto');
источник : https://learn.jquery.com/using-jquery-core/selecting-elements/
$('selector').click(function() { if ($(':animated').length) { return false; } $("html, body").scrollTop(0); });
если вы используете
css
анимация и назначить анимацию с помощью конкретногоclass name
, то вы можете проверить это так:if($("#elem").hasClass("your_animation_class_name")) {}
но убедитесь, что вы удаляете имя класса, который обрабатывает анимацию, после завершения анимации!
этот код можно использовать для удаления
class name
после завершения анимации:$("#elem").on('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){ $(this).removeClass("your_animation_class_name"); });