Javascript 我想在添加类时转换背景图像

若背景是固定位置的颜色标题，则颜色为fadein，但若背景是图像，则图像不是fadein

对不起，我不擅长英语，请参见下面的示例代码。 尝试删除CSS中的注释背景图像

$（窗口）。滚动（函数（）{
如果（$（文档）.scrollTop（）>0）{
$（'#header'）.addClass（'headtop'）；
}否则{
$（“#header”）.removeClass（'headtop'）；
}
});
#标题{
过渡：所有的1容易；
}
.headtop{
z指数：997；
位置：固定；
左：0；
右：0；
左边距：自动；
右边距：自动；
排名：0；
背景色：#AAAAA；
/*背景图片：url(https://cdn.mmaweekly.com/wp-content/uploads/2017/08/WME-IMG-750x370-748x370.jpg);*/
边界半径：0px 0px 25px 25px；
盒影：0 4px 8px 0 rgba（0,0,0,0.2），0 6px 20px 0 rgba（0,0,0,0.19）；
}

这是标题

这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
您可以通过在背景图像中添加一个div并使用不透明度0到1的转换来实现这一点

下面是一个代码示例：


$（窗口）。滚动（函数（）{
如果（$（文档）.scrollTop（）>0）{
$（'#header'）.addClass（'headtop'）；
}否则{
$（“#header”）.removeClass（'headtop'）；
}
});
#标题{
过渡：所有的1容易；
}
.headtop{
z指数：997；
位置：固定；
左：0；
右：0；
左边距：自动；
右边距：自动；
排名：0；
背景色：#AAAAA；
边界半径：0px 0px 25px 25px；
盒影：0 4px 8px 0 rgba（0,0,0,0.2），0 6px 20px 0 rgba（0,0,0,0.19）；
不透明度：1！重要；
}
#标题.背景{
z指数：-1；
位置：绝对位置；
宽度：100%；
高度：69px；
过渡：所有的1容易；
边界半径：0px 0px 25px 25px；
背景图片：url(https://cdn.mmaweekly.com/wp-content/uploads/2017/08/WME-IMG-750x370-748x370.jpg);
排名：0；
不透明度：0；
}
.头顶.背景{
不透明度：1！重要；
}

这是标题

这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容这是内容内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
这是内容
您不能将背景图像从无变为图像。实际上，
背景图像
不允许任何转换。但是，您可以在定义背景图像的整个元素中淡入淡出。然后，您将相应地转换
opacity
属性。@ssc-hrep3有没有办法在这个代码段中使用opacity？如果您想转换背景Img，您必须有一个上一个，否则它将弹出。检查此项：并查看第一个img弹出窗口如何显示，但其余部分如何显示动画。