Div скользит после прокрутки вниз

Question

Вот мой код http://jsfiddle.net/mihaene/7bdkB/

Я хочу ДИВ скользить в, как только я прокрутите вниз определенное количество пикселей. Он работает, но очень, очень задерживается (например, 5 секунд). В чем проблема?

Любое предложение было бы очень оценено.

Answer 1

Привета Я думаю, что проблема ваш еще блок. Затем jQuery запускает анимацию, которая занимает ~ 300 мс.

var $test2 = $(".test2"); 
$(window).scroll(function() { 
    if ($(this).scrollTop() > 100) { 
     $test2.stop().animate({left: "200px"}, 300); 
    } else { 
     $test2.stop().animate({left: "-90px"}, 300); 
    } 
}); 

Так просто используйте метод stop() для jQuery, чтобы остановить эти анимации.

На стороне: возможно, вам следует подумать о различных операторах if/else, чтобы не получать анимацию (или останавливать/перезапускать) при каждом прокручиваемом событии, как и другие.

Answer 2

Ваш пример jsfiddle не имеет проблемы с задержкой, но это, вероятно, связано с тем, что размер окна невелик, и есть немного возможностей для прокрутки. Возможной причиной задержки является частота срабатывания функции прокрутки. Они могут быстро складываться и вызывать задержку.

Добавьте console.log (если используете Firebug) и посмотрите частоту в консоли, чтобы лучше понять частоту.

Answer 3

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

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

Я использовал queue

DEMO

Надеется, что это помогает