我一直在努力尝试在滚动时改变我的背景图像。我尝试了发布到类似问题的解决方案,但到目前为止没有运气,它只会显示第一个背景图像。
基本上,我将背景设置为固定位置和几个 div,每个 div 的大小与视口(viewport)的大小相同,每个上边距的大小与视口(viewport)的高度大小相同。换句话说,当滚动时,用户只有在滚动过每个 div 后才能看到背景图像。我希望背景图片在滚动经过每个 div 后发生变化。
代码如下:
$(window).scroll(function() {
var windowY = $(window).height();
var scrolledY = $(window).scrollTop();
var image_url = '/images/image1.jpg';
if (scrolledY > windowY) {
image_url = '/images/image2.jpg';
}
$('body').css('background', "url(" + img_url + ")");
});
提前致谢!
最佳答案
您有两个拼写错误,括号然后是您的 image_url
变量名。最初你有:
$(body).css('background', "url(" + img_url) + "'";
更改为:
$(body).css('background', "url(" + image_url + ")");
括号不正确,最终连接字符串也不正确。此外,您的变量被声明为 image_url
,但在您的 css
函数中您使用了 img_url
。
关于滚动时 jQuery 更改背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15738080/