我想使用慢动画改变背景图像,但它不工作
$('body').stop().animate({background:'url(1.jpg)'},'slow');
语法有问题吗?
解决方法
您可以通过将图像不透明度降低为0来获得类似的效果,然后更改背景图像,最后再次将图像退色。
这将需要一个div,背后的页面上的一切与身体一样广泛。
<body> <div id="bg"></div> ... </body>
您可以使用CSS使其与页面一样宽:
#bg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
然后动画化它的属性。
$('#bg') .animate({opacity: 0},'slow',function() { $(this) .css({'background-image': 'url(1.jpg)'}) .animate({opacity: 1}); });
你可以得到更多的交叉效果,通过在这个之上放置第二个背景div,然后你可以褪色。