jquery - jQuery Cycle 和 CSS 设置 img 作为封面

Question

我知道，当您将图像设置为 a 时，background-image您可以设置background-size:cover

当图像是实际图像时，是否有一种方法可以为 jQuery Cycle 执行此操作<img>？

<div>
    <img src="image1.jpg">
</div>

Answer 1

是的，你可以做到。请记住，您也可以循环 div（不仅是图像）。因此，只需将 div 放入您的容器中并backgroundSize:cover;为它们设置并将您的图像作为背景。

<div id="cycleContainer"> 
    <div style="background: url(image1.jpg);"></div>
    <div style="background: url(image2.jpg)";></div>
    <div style="background: url(image3.jpg)";></div>
</div> 

#cycleContainer div {
    backgroundSize: cover;
}

Answer 2

我做了以下...

$('.aside-img div').each(function(index) {
    var imgsrc = $(this).find('img').attr('src');
        $(this).find('img').hide();
        $(this).css({
            'background-image':'url('+imgsrc+')'
        });
});