jQuery. Активировать обратный вызов при запуске анимации

У меня есть вопрос относительно обратного вызова функции .animate. Я пытаюсь, чтобы элемент исчезал, когда курсор покидает родителя. После исчезновения элемент должен быть скрыт, чтобы вы не могли нависнуть над ним с помощью курсора или щелкнуть его. Однако функция обратного вызова, которая скрывает элемент, вызывается в начале анимации, а не в конце. Я много пробовал, но ничего не получилось. Я могу опубликовать весь свой код (это не так много, просто небольшая домашняя страница с некоторыми ссылками, которые я сделал для себя), если это необходимо.jQuery. Активировать обратный вызов при запуске анимации

var fadeIn = {opacity: "1"}; 
var fadeOut = {opacity: "0"}; 

$(".link-main").hover(function(){ 
    $(this).children(".link-sub").css("z-index", "10").show().animate(fadeIn, 100); 
}, function(){ 
    // The animation. 
    $(this).children(".link-sub").animate(fadeOut, 100, "swing", function(){ 
     $(this).hide(); 
    }); 
});

Кроме того, просто использование .fadeIn и .fadeOut не работает по какой-либо причине. Элементы просто исчезнут мгновенно.

Заранее благодарен!

Edit: это то, что я прямо сейчас jsfiddle.net/rqfcZ

источник

2013-07-26 Wouter Florijn

Вы установили [$ .fx.off] (http://api.jquery.com/jQuery.fx.off/) на 'true'? –

Повторяющийся вопрос см. Ниже stackoverflow вопрос. http://stackoverflow.com/questions/5397260/animates-callback-function-complete-executed-at-start – Akki619

Мне удалось сделать подобные вещи, объединив анимации, чтобы каждая анимация выполнялась в обратном вызове предыдущего. Вы должны просто использовать обратный вызов для animate() вместо on hover()? –

.fadeIn и .fadeOut делает .show() и .hide() сами. Попробуйте удалить их и не использовать анимацию.

Просто $(element).fadeOut()

Кроме того, для событий, вы используете старый синтаксис Jquery. Взгляните на документы для .on()

источник

2013-07-26 13:15:43

Нет необходимости использовать on(), если только человек не будет действовать на динамически созданные элементы. Метод on() заменяет live(), но не все обработчики событий. – isherwood

@isherwood вы правы. Но так как '.hover' является сокращением для' .on ('mouseenter mouseleave') '(как сказано в документах), я думаю, было бы лучше узнать только« .on »для новичка. Они устарели для других специальных функций, таких как '.click()' –

@Paolo, где вы видите, что 'click()' устарел? –

@Frederic Хамиди Мои плохие .... Извинения

Пожалуйста, перейдите по этой ссылке для разрешения

http://fisherwebdev.com/wordpress/2009/06/08/scope-issues-with-the-callback-to-jquerys-animate-function/

Быстрый взгляд на ссылку выше и пришел к что вам нужно добавить к нему переменную ref.

источник

2013-07-26 13:38:24 Akki619

У меня есть только базовое понимание JS/jQuery, поэтому я действительно не понимаю эту статью. Не могли бы вы сказать мне, что я должен изменить в своем коде? –

Я редактировал вам скрипку здесь http://jsfiddle.net/Akash619/ZdrZW/, пожалуйста, посмотрите, что все, что я добавил, является переменной ref в $ (this) подобно var a = $ (this); Пожалуйста, поиграйте, чтобы получить функциональность по желанию ... – Akki619

jQuery. Активировать обратный вызов при запуске анимации

ответ

Смежные вопросы