Jquery 修复了使用鼠标滚轮滚动时元素闪烁的问题

我试图使侧栏在滚动到某一点后固定在顶部

var sidebarTopPos = $('#sidebar').offset().top;
$(window).scroll(function(event) {
    if ($(window).scrollTop() >= sidebarTopPos) {
        $('#sidebar').css({
            position: 'fixed',
            top: 0
        });
    }
    else {
        $('#sidebar').css({
            position: 'relative'
        });
    }
});​

看看这个

当我向下拖动滚动条时，整个过程运行良好。然而，当我尝试使用鼠标滚轮滚动时，我看到当侧栏从“相对”变为“固定”时恼人的闪烁，我已经尝试了很多东西。请帮忙

---

编辑：也许我应该说得更清楚些。侧栏“闪烁”仅当它穿过顶部div时才会出现。我也遇到了同样的问题，这似乎是一个错误，它发生在基于计算机GPU、内存、CPU等的浏览器无法处理太多内容时。我可以通过向固定位置元素添加以下转换代码来修复它，（

transform:translateZ（0）；-webkit transform:translateZ（0）；

）强制浏览器使用硬件加速来访问设备的图形处理单元（GPU）以使像素飞起来。另一方面，Web应用程序在浏览器的上下文中运行，这使软件可以完成大部分（如果不是全部的话）功能但网络已经迎头赶上，大多数浏览器供应商现在通过特定的CSS规则提供图形硬件加速

使用-webkit transform:translate3d（0,0,0）；将使GPU在CSS转换中起作用，使它们更平滑（FPS更高）

注意：translate3d（0,0,0）对你看到的东西没有任何作用。它在x、y和z轴上移动对象0px。这只是一种强制硬件加速的技术

#sidebar {
    /* MAGIC HAPPENS HERE */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

---

我知道这是一个老问题，你肯定已经找到了答案，但如果有人有同样的问题，需要解决它，只需将此css代码添加到侧栏

#sidebar {
   -webkit-backface-visibility: hidden;
   -webkit-perspective: 1000;
}

---

似乎在Firefox中也能正常工作。你在哪个浏览器中看到了这个问题？我更新了JSFIDLE。“top”div的高度不能完全放在一个“鼠标滚轮”中，那么你就会看到问题。我在使用Chrome 18更具体地说，我看到了“测试…”闪烁，因为它在假设正确的位置之前会向上移动一点注：它在所有其他浏览器中都能工作。这很奇怪…非常感谢大家！@Jay Na欢迎使用浏览器！这根本不能解决问题。当我使用鼠标滚轮时，它会闪烁，当我使用滚动条时，它绝对是粘性的。没有任何东西可以移动n在我的例子中。我认为这与GPU无关。我使用Chrome43.0（准确地说：我不能使用固定定位）太棒了！谢谢！