мерцающий jquery div на свитке?

Question

У меня есть div, который появляется на прокрутке после 520px. Каждый раз, когда я прокручиваю вниз, он, кажется, исчезает, а затем постоянно мерцает, как будто он продолжает работать снова и снова. Я искал это бесконечно, и я не могу найти исправление, которое действительно работает. (Это в Chrome). Вот мой Jquery:

$(window).bind("scroll", function(e) { 
e.preventDefault(); 
if ($(this).stop().scrollTop() > 520) { 
    $("#fadeblock").fadeIn(); 
} else { 
    $("#fadeblock").stop().fadeOut(); 
} 
}); 

И это мой CSS

#fadeblock { 
display:none; 
position:fixed;} 

#sidebar { 
    width:200px; 
    height:200px; 
    padding:450px 20px 20px 20px; 
    position:absolute; 
    margin-left:3%; 
} 

HTML:

<div id="fadeblock"> 
<div id="sidebar"> 
<div id="title">{Title}</div> 
<div id="desc">{Description}</div> 
<div id="links"> 
    <a href="/">link</a> 
    <a href="/">link</a> 
    <a href="/">link</a> 
    <a href="/">link</a> 
</div> 

Answer 1

В самом деле, ваш код делает держать запустив весело и снова и снова.

Одно решение установить переменную для отслеживания состояния DIV в:

var pos=0, fadedIn=false; 

$(window).on("scroll", function(e) { //usually, just use: $(window).scroll(function(){ 
    e.preventDefault(); //this line probably unnecessary 
    pos = $(this).scrollTop(); 
    if (!fadedIn && pos > 520) { 
     $("#fadeblock").fadeIn(); 
     fadedIn = true; 
    } else if (fadedIn) { 
     fadedIn = false; 
     $("#fadeblock").fadeOut(); 
    } 
}); 

Также:

1) Если вы используете версию JQuery> 1.7, использовать .on() вместо .bind()

2) Если у вас есть хорошие причины для этого, не используйте e.preventDefault() на window.scroll()

Смотрите также:

http://davidwalsh.name/javascript-debounce-function

How to implement debounce fn into jQuery keyup event?