jquery - 如何使用 jquery 将背景大小设置为 100%？

Question

当我使用 nivo-lazy slider 时，会出现图像不适合 slider 包装的问题。在 nivo slider 上，我找到了一个解决方案

.nivoSlider img {
position:absolute;
top:0px;
left:0px;
max-width: none;

    width:100%;
    height:100% !important;
}  

但它不适用于 nivo-lazy slider 。

我认为 nivo-lazy slider 通过使用 jquery 更改背景图像来工作。当我把 background-size:100% 100%;在浏览器的检查元素上采用元素样式；它会起作用。所以我需要通过 Jquery 将背景大小设置为 100%。

我该怎么做？提前感谢您的帮助。

更新

我写的格式如下。

slider.css('background','url("something.jpeg") no-repeat','background-size','100% 100%'); 

在第 123 行的 jquery-nivo-slider.js 中。

那我把代码改成

slider.css('background','url("'+ parse_src(vars.currentImage) +'") no-repeat'); 
document.getElementById('slider').style.backgroundSize = "100% 100%";

但现在的问题是我使用动态大小的图像， slider 会根据每个图像的宽度适本地设置小的 div 及其宽度。

Answer 1

您可以使用 jQuery 更改任何 CSS 属性。

如果你使用的元素有 id="nivo-lazy-div，那么这样做:

$("#nivo-lazy-div").css("background-size":"100% 100%");

更新

如果你只是改变背景图片，那么你实际上不需要每次都设置它。只需将它添加到您的 CSS 中，任何背景图片都会重新调整大小。

#nivo-lazy-div{
    background-size:100% 100%;
}

更新

这样做:

slider.css({
    'background' : 'url("' + parse_src(vars.currentImage) + '") no-repeat',
    'background-size' : '100% 100%',
});