js滚动平滑

Question

我真的对滚动事件有疑问。 我试着彻夜解决它，但我不能。

我正在尝试在顶部粘贴导航。 当$(window).scrollTop()在导航之前传递点时，将执行操纵杆效果。

问题是，IE和Chrome上会出现“眨眼”效果（类似延迟过程）但Firefox上没有。

在我的研究中，我知道Firefox默认情况下是“平滑滚动”。

但是，请在Chrome或IE上查看此示例

http://www.backslash.gr/demos/jquery-sticky-navigation/

就像在Firefox上一样流畅，代码就是那么简单......

关键是，我正在做与此示例完全相同的事情，但为什么我有'眨眼'效果？

CSS上的技巧？

有没有什么方法可以像js上的Firefox一样创建一个流畅的scrool？

非常感谢您的帮助。

$(window).on('scroll', Sticky);

function Sticky(){
    $(this).scrollTop() > anchor.offset().top
    ? nav.css({ 'position': 'fixed', 
                      'z-index': z_index, 
                       top: y, 
                       left: x, })
    : nav.css({ 'position': 'static', });
};

Answer 1

查看不完整的示例代码，很难确定发生了什么，所以请用完整的代码更新您的问题，或者更好 - 上传一个JSFiddle作为示例，我们可以通过必要的更改直接更新它。 到目前为止（基于我之前所说的），由于示例代码中的拼写错误，您看起来会出现flickering效果：

? nav.css({ 'position': 'fixed', 
                  'z-index': z_index, 
                   top: y, 
                   left: x, })
: nav.css({ 'position': 'static', });

在那里你不终止，需要加以应用（你用逗号结束它的CSS属性和值的阵列, ），你也没有在一个单引号括一些CSS属性' 。 你的代码应该是 ：

? nav.css({ 'position': 'fixed', 
                  'z-index': z_index, 
                   'top': y, 
                   'left': x })
: nav.css({ 'position': 'static' });

当然，如果你已经预先设置了变量z_index ， y和x 。

编辑和免责声明：我用原始的演示代码创建了一个新的JSFiddle 。 您提到的演示版权受版权保护，所以请将您的感谢归功于原作者，而不是我，如果这可以帮助您。 我发布的JSFiddle代码可以免费下载。 所以我想将它重用于演示目的也是可以的。 更改该代码以符合您的要求，并在更新它时将其更新为新版本。 它可以帮助您跟踪您做错的地方（如果有的话）。 ;）

Answer 2

我想你可能会在这里混淆两件事。

1. 查看您链接到的工作代码。 如果你使用鼠标滚动滚动chrome或IE或firefox，那里就会闪烁。
2. 眨眼是因为你突然改变了位置。 尝试更改js，使其为位置设置动画，而不是突然改变其值。

正如其他人所说的那样，链接到一个正常工作的代码并通过展示一个技巧来期待答案可能无助于我们所有人。 尝试在js的位置变化线上添加动画，看看是否有帮助。

这里没有诀窍。 它的全部代码所以阅读源和享受。