jquery - 更改 jQuery.scroll() 上 DOM 元素的位置会导致滚动不稳定

标签 jquery scroll parallax

不久前我创建了一个使用一些热门 jQuery 视差滚动的网站,它曾经非常流畅,但最近(浏览器更新?)它变得不稳定。我认为这与 jQuery 滚动事件的触发频率有关。这是我正在尝试做的事情的一个小示例大小的版本...

$(window).scroll(function() {
    offset = window.pageYOffset;
    $('#firstImg').css({
         "top" : -750 + (offset/1.5) + "px"
    });
});

基本上,当我向下滚动时,它会逐渐使图像垂直视差。您可以在这里查看产品:http://www.davegamache.com/sandbox/best-of-2010/ 。 Campaign Monitor 还为他们的招聘网站重新调整了我的代码...在这里查看:http://www.campaignmonitor.com/hiring/ .

我需要弄清楚如何防止令人难以置信的不稳定滚动。我什至创建了一个 setInterval 并手动触发了重新定位代码(而不是使用 .scroll() 事件),但无法让它变得平滑(50m/s 是不稳定的,因为它没有触发足够的,10m/s只是因为它似乎很频繁而感到紧张?)。

如果有人可以提供帮助,请告诉我。非常感谢!

最佳答案

我查看了您的网站和campaignmonitor.com。你的似乎工作正常,而另一个则显示你所描述的不稳定滚动。

查看代码之间的差异后,我注意到 Campaign Monitor 在其项目上使用精确的像素进行样式定义(例如《七岁年轻》的条形图),而不是像您的那样基于百分比的位置(例如草图元素) )。

我使用 firebug 对一些元素测试了更改,它似乎解决了问题。

希望有帮助。

关于jquery - 更改 jQuery.scroll() 上 DOM 元素的位置会导致滚动不稳定,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5452719/

相关文章:

javascript - 我如何使用 jquery(或只是 javascript)遍历 cookies?

jquery - 我如何使分辨率正常

javascript - 从 JQuery 调用 RESTFUL 服务

javascript - 是否有一种 CSS 方法可以使动态数据驱动的字符适合 div 按钮?

javascript - 提高 JavaScript 转换的性能

javascript - 查找整页高度

Swift 3 - CollectionView 选择不可见

javascript - 视差、带有 SVG 的 javascript?是对的吗?

html - 主背景图像已修复,主 div 内的 div 背景图像也已修复

ios - Facebook News 纸质应用,全尺寸图像视差效果