jQuery Анимация: Callback Called Twice

Question

Я запускаю набор анимаций, когда пользователь прокручивает вниз по сайту (используя обратный вызов afterMove от onepage-scroll), и при анимации некоторых элементов неожиданно одна и та же функция вызывается несколько раз.

Используя это, у меня нет проблемы:

base = $('section[data-index="' + index + '"]'); 
base.find('h1').animate({opacity: 0.1}, 3000); 
console.log('Finished #' + index); 

И у меня есть правильный вывод на консоль после перехода в раздел № 3.

Finished #2 
Finished #3 

Но когда я пытаюсь использовать форму, например,

base.find('#my-form-id').animate({opacity: 0.1}, 3000); 

это выход:

Finished #2 
Finished #3 
Finished #2 
Finished #3 

Последние два бревна регистрируются только тогда, когда анимация заканчивается.

В чем причина этого поведения?

Answer 1

На самом деле, я искал не в том месте.

Настоящая проблема заключалась в том, что я стилизовал элемент с помощью перехода непрозрачности CSS3. Когда я попытался применить любое другое действие к тому же элементу, который использовал бы те же атрибуты, у меня была эта проблема.

Кажется, что они не играют хорошо вместе.