Question

之前我已经使用过这段代码用于其他各种各样的想法，但我从未在动画之外做过fadein，所以我希望图像在变化时淡化，这个代码是否可能？或者我必须找到另一种方法吗？你看到fadein的地方是我现在拥有它的地方但是淡入淡出似乎不起作用。我尝试将时间与间隔相匹配，但也没有运气。

$(function () { // DOCUMENT ready shorthand
    var cnt=0, bg;
    var $body = $('body');
    var arr = ['images/01.jpg','images/02.jpg','images/03.jpg','images/04.jpg','images/05.jpg','images/06.jpg','images/07.jpg'];

    var bgrotater = setInterval(function() {
        if (cnt==7) cnt=0;
        bg = 'url("' + arr[cnt] + '")';
        cnt++;
        $body.css('background-image', bg).fadeIn('fast');
    }, 5000);
});

Answer 1

如果将来有人遇到此问题，那么您所做的就是像这样在CSS中添加转换。还要注意它所说的过渡部分。

body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background-color: #666;
background-image: url(images/01.jpg);
background-size: 100% 150%;
background-attachment:fixed;
margin: 0;
padding: 0;
color: #FFF;
transition: background 1.5s linear;

}

无法让背景图片淡入？

1 个答案: