Question

我基本上是在尝试像普通幻灯片一样更改背景，但是如您在下面的代码中所看到的，第一种情况下的图像会突然更改，而在第二种情况下，即使图像平滑地变化，时间也是要么太短要么太长，并且fadesOut（）在大部分时间里都趋于保留，使得背景在大部分时间里看起来都是白色的。如果有人可以通过建议另一种放置不同方法的方法来帮助我，请执行任何操作。谢谢！

setInterval(function () {
        $(".dexs").css("background-image", slides[c]);  
        $(".dexs").fadeOut(1000);
        $(".dexs").fadeIn(1000);
        $(".dexs").css("background-size", "cover");
        if (c == 1) 
            c = 0;

        else
            c = 1;

            console.log(c);


        }, 2000);

我也尝试过以这种方式->

 $(document).ready(function () {
    var c = 0;
    var slides = ["url(bg.jpg)", "url(bg2.jpg)"];

    setInterval(function () {

        $(".dexs").fadeIn(1000);
        $(".dexs").css("background-size", "cover");
        $(".dexs").css("background-image", slides[c]);
        $(".dexs").fadeOut(1000);
        if (c == 1) 
            c = 0;

        else
            c = 1;

            console.log(c);


        }, 2000);


});

HTML-> <img class="dexs"/> CSS->

  '.dexs{
   position: absolute;
   z-index: -1;
   height: inherit;
   width: inherit;
   background-size: cover;
   background-image: url(bg.jpg);
  }'

图片在jQuery中没有按顺序褪色吗？

0 个答案: