使用 JQuery 更改正文背景图像属性答案

【问题标题】：change body background image property using JQuery使用 JQuery 更改正文背景图像属性
【发布时间】：2018-06-29 22:18:13
【问题描述】：

我想用 fadeIn 和 fadeOut 效果更改我的背景图像。我可以使用此代码更改它，但我不能使用fadeIn 和fadeOut 效果。我怎样才能使用这个效果？我的意思是最后一个背景应该有fadeOut 效果，下一个背景应该有fadeIn 效果。
注意：背景属性是 body 的一部分，我不希望 body 中的元素具有 fadeIn 或 fadeOut 效果。 jQuery：

$(document).ready(function(){
    setInterval(function () {
        $("body").css("background", "url(../img/2.jpg) center center no-repeat");
        $("body").css("background-size", "cover");
    }, 3000);
});

css:

body{
    background: url(../img/1.jpg) center center no-repeat;
    background-size: cover;
}

【问题讨论】：

背景图片不能淡化，只能淡化div
@Eric 我没有办法做到这一点吗？有什么建议吗？
如果您可以更改 DOM 结构，请考虑@mccambrige 答案，因为没有办法做到这一点。如果你不能改变 DOM 结构并且如果你只有 2 或 3 个背景图片可以玩，你也可以使用 body 的 :before 和 :after 选择器（知道这些选择器不能通过 Jquery 直接访问）@ 987654321@
stackoverflow.com/questions/6502157/…

标签： jquery css

【解决方案1】：

<body>
    <div class="background">
         <!-- the rest of your existing body contents -->
    </div>
</body>

这更像是一个概念性的答案。但是，如果您在您的body 标签和您当前网站的其余部分之间添加一个div，将背景附加到该div 并以这种方式进行操作，您将获得更好的结果。您只需要弄清楚如何将您的内容放在div.background 之上。只需确保背景div 是全宽、全高等。稍等片刻。我打赌你会弄清楚其余的。

【讨论】：