4

我在一个网站上工作：

http://beta.projektopia.se/

正文有几个背景图像，它们在滚动时更新，如下所示：

$(document).ready(function(){

    $(document).scroll(function(){
        var scrollfactor=$("body").scrollTop()*0.2;
        var centerscrollpos =scrollfactor+613;
        var docheight = $(document).height();
        var windowheight = $(window).height();
        var bottompos = (docheight-980)-((docheight-windowheight)*0.2)+scrollfactor;
        var scrollpos = 'center '+scrollfactor+'px,center '+bottompos+'px, center '+ centerscrollpos+'px,center 0px';
        $("body").css("background-position", scrollpos);
    });
});

很多计算，但重要的是创建了一个滚动位置，它应该在滚动时改变背景的位置，以创建视差效果。它在 chrome 中运行良好，但在 Firefox 中，假设获取当前滚动位置的变量滚动因子不会更新。

ps，有些人由于缺少正确的文档类型而遇到此问题。我相信我已经像这样正确地声明了它：

<!DOCTYPE html>
4

2 回答 2

1

众所周知，scrollTopjQuery 方法存在问题。

根据浏览器的不同，您可能需要使用$('html, body').scrollTop()or$(document).scrollTop()或$(window).scrollTop()。

于 2012-11-04T15:06:49.507 回答
1

对我来说，问题是元素上的任何类型的overflow属性。html在我删除它的那一刻，我.scrollTop()开始正常工作。我仍然想要overflow-x: hidden页面上的全局属性，所以我只是在body元素上设置它。

于 2019-04-10T08:11:23.550 回答