使用jQuery滚动来更新位置使元素闪烁

Question

我有一个侧栏，我希望在用户向下滚动到它将消失的位置时粘在右侧。 我在这样做的第一次尝试看起来像：

$(window).scroll(function(){ 
    if($(window).scrollTop() >= 524){ 
    if(!$(".page #sidebar").hasClass("sticky")){ 
     $(".page #sidebar").addClass("sticky"); 
    } 
    } 
    else{ 
    if($(".page #sidebar").hasClass("sticky")){ 
     $(".page #sidebar").removeClass("sticky"); 
    } 
    } 
}); 

类粘曾与top和right值position: fixed，所以它会在浏览器窗口中正确坚持。唉，正如我测试的那样，我意识到这个错误：作为屏幕右侧的边栏，如果我将浏览器窗口的大小调整到我正在处理的分辨率以下，当然，侧边栏会停留在浏览器窗口的相对位置。

我来了，然后，用此溶液：将边栏与绝对定位内的另一个相对定位容器，然后计算其与JavaScript位置。 除了（我认为）不必要的沉重，这个解决方案的作品，但使元素闪烁因为.scroll事件没有足够快的速度。代码如下：http://www.onewayitalia.it/agenzia-di-comunicazione/web-agency-per-la-realizzazione-di-siti-e-portali-internet/

搞笑的是的是，当我写，我意识到计算器是做我想同样的事情：

$(window).scroll(function(){ 
    if($(window).scrollTop() >= 524){ 
    if(!$(".page #sidebar").hasClass("sticky")){ 
     $(".page #sidebar").addClass("sticky"); 
    } 
    else{ 
     $(".page #sidebar").css("top",$(window).scrollTop()-524+"px"); 
    } 
    } 
    else{ 
    if($(".page #sidebar").hasClass("sticky")){ 
     $(".page #sidebar").removeClass("sticky"); 
    } 
    } 
}); 

你可以看到活生生的例子用完成类似的问题侧边栏;它似乎也使用固定的定位，并不打破窗口调整大小。 任何见解？

Answer 1

你可以尝试$ .animate没有队列你的计算位置。这可能看起来更顺畅