Jquery 滚动时将背景移出图片
我刚刚尝试了一些效果,包括移动背景,但是当使用下面的代码时,当你在一个长页面上向下滚动时,背景会越来越高。任何建议,如如何使它停止时,它得到的图像结束(如果你知道我的意思…)。我不想在向下滚动时看到空白Jquery 滚动时将背景移出图片,jquery,html,css,Jquery,Html,Css,我刚刚尝试了一些效果,包括移动背景,但是当使用下面的代码时,当你在一个长页面上向下滚动时,背景会越来越高。任何建议,如如何使它停止时,它得到的图像结束(如果你知道我的意思…)。我不想在向下滚动时看到空白 body { background: url(/images/bg.jpg) no-repeat center center fixed; background-position:center; background-size: 110% 120%; backgr
body {
background: url(/images/bg.jpg) no-repeat center center fixed;
background-position:center;
background-size: 110% 120%;
background-repeat: no-repeat;
}
<script>
$(document).ready(function () {
$('body').mousemove(function (e) {
var x = -(e.pageX + this.offsetLeft) / 20;
var y = -(e.pageY + this.offsetTop) / 20;
$('body').css('background-position', (-3 + x) + 'px ' + (-3 + y) + 'px');
});
});
</script>
正文{
背景:url(/images/bg.jpg)没有固定的重复中心;
背景位置:中心;
背景大小:110%120%;
背景重复:无重复;
}
$(文档).ready(函数(){
$('body').mousemove(函数(e){
var x=-(e.pageX+this.offsetLeft)/20;
变量y=-(e.pageY+这个偏移量)/20;
$('body').css('background-position',(-3+x)+'px'+(-3+y)+'px');
});
});
您可以尝试以下方法:-
html{ height:100%; width:100%;}
body {height:100%; width:100%; overflow:hidden;}
你能提供这个页面的链接吗?或者bg.jpg首先输入背景图像高度(BH)和窗口高度(WH),然后检查这个条件:if((BH-WH)>e.pageY){//do as u r do}。希望您的问题能得到解决。@Dheeraj您应该能够使用任何图像,因为图像大小设置为110%和120%。@ManishPatwari您的意思是将其与之比较?我只是不知道该与什么进行精确的比较,因为图像的高度可能会有所不同。你必须得到图像的高度,然后用窗口高度减去它,然后滚动背景直到不同的高度。我已经设置了这些,除了溢出:隐藏,这将完全带走我的滚动条。所以没有:)