Задержка анимации

Question

http://jsfiddle.net/pahnin/rdgbq/16/ посмотрите на эту скрипку. В этой скрипке функция анимации запаздывает и выглядит странно, даже когда я первый раз нажимаю на логотип, анимация не работает

Любое предложение, пожалуйста. ,

Answer 1

ОК, думаю, я нашел, почему ваш код работает медленно.Каждый раз, когда вы нажимаете логотип div, вы подключаете новый обработчик событий .click().

Попробуйте изменить отступ, чтобы $('.items').click(function() { находился за пределами блока $('#logo').click(function() {.

http://jsfiddle.net/rdgbq/17/

так что ваш код становится (только частичный раздел вашего кода):

$('#logo').click(function() {
    a = 1;
    d = -2;
    $('#container div').each(function() {
        $('#sidebar').hide().animate({
            top: '80%'
        }).removeClass('side');
        if (d > 3.5) {
            d = -2;
        }
        c = d * 10 + "%";
        if ((a - 1) % 3 == 0) {
            b = a * 10 + "%";
        }
        $(this).animate({
            top: b,
            left: c
        });
        a++;
        d += 2;
        $(this).show();
        $(this).corner();
    });
    d = -2;
});
$('.items').click(function() {
    var h = $(this).html();
    $('#sidebar').show().html(h).animate({
        top: '10%'
    }).corner("left").addClass('side');
    $('#container div').each(function() {
        if (d > 3.5) {
            d = -2;
        }
        c = -d * 10 + "%";
        $(this).animate({
            top: '100%',
            left: c
        });
        d += 2;
        $(this).show();
    });
});

Существует еще некоторая оптимизация, которую вы можете выполнить, но это должно помочь!