get*_*way 18 jquery animation background image
我想用慢动画改变背景图像,但它不起作用
$('body').stop().animate({background:'url(1.jpg)'},'slow');
Run Code Online (Sandbox Code Playgroud)
语法有问题!!
Mar*_*row 47
您可以通过将图像不透明度淡化为0来获得类似的效果,然后更改背景图像,最后再将图像淡入淡出.
这将需要一个div,在页面上与身体一样宽的其他内容之后.
<body>
<div id="bg"></div>
...
</body>
Run Code Online (Sandbox Code Playgroud)
您可以使用CSS将其设置为与页面一样宽:
#bg {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
Run Code Online (Sandbox Code Playgroud)
然后为它的属性设置动画.
$('#bg')
.animate({opacity: 0}, 'slow', function() {
$(this)
.css({'background-image': 'url(1.jpg)'})
.animate({opacity: 1});
});
Run Code Online (Sandbox Code Playgroud)
你可以通过在这一个上面加上第二个背景div来获得更多的交叉效果,然后你可以淡入其中.
归档时间: |
|
查看次数: |
92933 次 |
最近记录: |