jquery - scrolltop() 在 chrome 和 safari 中运行不流畅,但在 firefox 中运行

标签 jquery css cross-browser scroll

如果您查看此链接 http://jsfiddle.net/Hbkdt/ .

$(window).scroll(function() {
       $(".fixed").css("top", $(window).scrollTop() + "px");
    });

向下移动滚动条。然后你可以看到 .fixed DIV 在 FF 中运行流畅,但在 Safari 和 Webkit 中运行不流畅。

我不知道该如何解决。任何帮助表示赞赏:)

我在 mac 中使用 Chrome 版本 22.0.1229.94。

最佳答案

你只使用 position: absolute 并在元素上设置 scrollTop 因为当使用 position: fixed 时,如果窗口宽度小于元素的宽度,元素的一部分将被隐藏,即使您向右滚动以尝试查看它也是如此:

http://jsfiddle.net/Hbkdt/11/

解决此问题的另一种方法是坚持使用 position: fixed,然后解决部分元素被隐藏的问题:

http://jsfiddle.net/thirtydot/Hbkdt/26/

元素的 left 属性在滚动设置上,使水平滚动看起来按预期工作:

$(window).scroll(function() {
    $(".fixed").css("left", -$(window).scrollLeft() + "px"); 
});

由于 position: fixed 现在再次使用,垂直滚动非常流畅。

关于jquery - scrolltop() 在 chrome 和 safari 中运行不流畅,但在 firefox 中运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13156255/

相关文章:

jquery - 可扩展的 div 网格以适应浏览器大小

php - 创建用户可以自定义的页眉/横幅

html - 如何停止我的动画

asp.net - 兼容性问题是IE10

javascript - 奇怪的行为 - 序列化

javascript - 如何使用 jquery 关闭而不隐藏点击时的 div?

javascript - jQuery Mobile – 切换单选按钮的启用和禁用状态

Javascript 加载外部 html 文件

html - 左浮动在 Internet Explorer 8 中不起作用

html - 跨不同浏览器的一致网站呈现