Javascript 延迟加载img到背景而不是背景图像

我想将图像懒散地加载到css

background

标记中，而不是

background image

标记中，因为我还有一个半透明的覆盖层，需要以以下方式应用：

background: linear-gradient(to bottom, rgb(255, 255, 255), rgba(255, 255, 255, 0.60) 75%), url("myimage.jpg") scroll bottom no-repeat;

目前我正在使用jquery.lazy库（），但我愿意使用任何懒散加载库，只要它支持淡入淡出过渡。我怎样才能做到这一点

此外，我不确定这些插件是如何工作的，但如果它们只是覆盖目标标记中的任何内容，比如简单地覆盖

背景
标记中的内容以添加图像，那么显然不会工作，因为这将覆盖我的半透明覆盖

谢谢
 点击这里

是的，你可以用我的。但是您必须使用回调来使其正常工作，因为这不是默认的背景图像。我给你举了一个完整的例子，应该很容易理解

因为你说的是淡入淡出过渡
，我想你指的是这个插件的
效果
选项。所以我添加了一个
fadeIn
效果。如果您不想这样做，只需删除选项中的
effect
和
effectTime


$（函数（）{
$（“div”）.Lazy({
效果：“fadeIn”，
生效时间：1000，
加载前：函数（e）{
//加载之前，将渐变存储到图元数据上
e、 数据（“梯度”，例如css（“背景图像”）；
},
后载：功能（e）{
//然后创建想要的背景图像
e、 css（“背景图像”，e.data（“梯度”）+，“+e.css（“背景图像”））；
}
})
});
div{
宽度：600px；
高度：400px；
背景：线性渐变（至底部，rgb（255，255，255），rgba（255，255，255，0.60）75%）滚动底部无重复；
}