Блог

Я пытаюсь анимировать свои заголовки аккордеона, чтобы имитировать ленту, перетаскиваемую на оболочку при наведении курсора мыши, и при наведении курсора ее вытаскивают из оболочки.

Теперь, если вы проверите этот первый jsFiddle, все работает нормально, но когда я пытаюсь анимировать ширину h2, бит ленты за пределами оболочки исчезает на секунду и возвращается, когда анимация ширины завершена. Проверьте этот jsFiddle, чтобы увидеть проблему.

Я делаю это неправильно? Есть ли способ анимировать как h2, так и span одновременно?

Во время анимации H2 получает ‘overflow: hidden’, поэтому ваша лента исчезает. Кажется, что jQuery делает это автоматически при анимации ширины.

Что вы могли бы сделать, так это использовать другую библиотеку анимации, такую как emile, или анимировать набор свойств emtpy и использовать шаг обратного вызова $.fn.animate для установки ширины.

Или вы можете изменить свой css, чтобы переполнение, скрытое в H2, не влияло на вас.