[英]JQuery footer div Parallax scrolling effect using body scroll value
我坚信,使用“ body” scrollTop()更改背景位置,对页脚“ div”背景进行轻微的视差效果很简单
这是我的试用,但是页脚“ div”的背景没有变化。 我在这里看不到我在做什么错:
<body>
<div class="footer_parallax"></div>
</body>
$('body').scroll(function(){
var x = $(this).scrollTop();
$('.footer_parallax').css('background-position','0% '+parseInt(-x/10)+'px');
});
此处的codepen: http ://codepen.io/ssstofff/pen/zxXyMp
由于Codepen使用iframe,因此我认为通过body
标签获取滚动元素存在一些问题。 当我将其更改为window
它可以工作。
这是完整的代码段(CSS方法符号已更改):
$(window).scroll(function(){
var x = $(this).scrollTop();
$('.footer_parallax').css({'background-position': '0% '+parseInt(-x/10)+'px'});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.