jQuery анимация - несовместима после первого запуска - PullRequest
Новая
       2

jQuery анимация - несовместима после первого запуска

0 голосов
/ 04 января 2012

У меня есть список изображений, которые плавают рядом друг с другом, и некоторые ссылки на вызовы JavaScript в верхней части страницы. При нажатии на ссылку все видимые изображения должны уменьшаться и исчезать, а выбранные элементы затем расширяются и становятся видимыми.

Это отлично работает в первый раз. Однако последующие изменения в выделении дают непредсказуемые результаты с не всегда происходящим замиранием.

Я создал jsFiddle пример , который лучше показывает проблему. Любая помощь приветствуется.

Крис.

1 Ответ

1 голос
/ 04 января 2012

Проблема заключается в том, что анимации запускаются для каждого элемента отдельно, как и обратные вызовы. Так что showList работает 15 раз.

Одним из способов решения этой проблемы является использование счетчика для отслеживания последней анимации. Например: 

function collapseList(selectedFilter) {
    var els = $('.listItem'),
        count = els.length;

    els.animate({
        opacity: 0,
        width: "0px",
        height: "0px"
    }, 2000, function() {
        if ( !--count ) {
          els.hide();
          showList(selectedFilter);
        }
    });
}

Попробуйте здесь: http://jsfiddle.net/msb9p/11/

...