javascript - $(window).scroll 函数上的 Safari 抖动/闪烁

标签 javascript jquery css safari

我在 Safari 中遇到一个问题 - 滚动时图像闪烁或抖动,当在页面滚动中更改一个元素的高度和另一个元素的边距时。

到目前为止,这在 Chrome/Firefox (OSX) 中运行顺利,符合预期,但您会在此处看到 Safari 上的问题:

http://jsfiddle.net/y1Lrnd24/7/

$(window).scroll(function () {

    var imgHeight = 300;
    var scrollTop = $(window).scrollTop();
    var slideHeight = imgHeight - scrollTop;
    var marginTop = scrollTop;

    if (slideHeight > 0) {
        $('.slide').css('height', slideHeight);
        $('#slide-holder').css('paddingTop', marginTop);
    }

});

(全屏显示效果更好:https://jsfiddle.net/y1Lrnd24/7/embedded/result/)

有人知道吗?我尝试将 marginTop 更改为 paddingTop,但这没有任何效果。

感谢任何帮助 - 希望这是一个快速修复!

编辑:我想我应该在这里补充一点,这个“错误”在使用鼠标滚轮时最明显...

最佳答案

实际上,在 Safari 中查看 JSfiddle 对我来说完全正常。这让我怀疑其他事情 - Safari 中是否安装了任何插件?您是否尝试过重置 Safari?

http://osxdaily.com/2014/01/09/fix-safari-problems-mac-reset/

据我了解,Chrome 和 Safari 使用相同/相似的渲染引擎...如果一个在工作而另一个不工作,则可能是 Safari 的问题。

关于javascript - $(window).scroll 函数上的 Safari 抖动/闪烁,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31412237/

相关文章:

javascript - iFrame 内的页面顶部 - 跨域

javascript - 在页面加载时更改 div 背景?

javascript - jQuery-在动画 div 中的图像源之间动态切换

javascript - 关注输入触发两次而不是仅一次触发

javascript - 在 Knockout 中保存原始值

html - 当浏览器宽度改变时调整 Flexbox 内容的大小

javascript - 使用 javascript 突出显示代码示例中的语法。

javascript - 将 jquery 代码转换为 Angular 代码

html - 文本在 CSS 中与照片对齐

css - Bootstrap 3 复杂布局