Question

请帮我解决jQuery代码。

需要获取每个图像（img）属性并将其放置在div的背景中。我已经有了这个，但它没有以正确的方式工作：

var $source = $("img").attr("src");
$('div').each(function () {
    $(this).css({
        'backgroundImage': 'url(' + $source + ')'
    });
});

请检查链接：JSFIDDLE

PS 即可。

在非解决方案中为每个图像添加特定类，因为列表将非常大且动态。

Answer 1

试试这个

jQuery(document).ready(function ($) {
    $("img").each(function () {
        var $source = $(this).attr("src");
        $(this).next("div").css({
            'backgroundImage': 'url(' + $source + ')'
        });

    });
});

JSFIDDLE

Answer 2

我就是这样做的。有了这个，图像将覆盖整个div而不管其大小。

HTML:
<div class="imagebox"><img src="../img/picture.jpg"></div>

CSS:
.hide { 
   opacity:0; 
}
.imagebox { 
   background-size: cover;  
   background-position: center;
}

CODE:
var imgurl = jQuery("img").attr("src"); // or specific jQuery(".imagebox img").attr("src");
var imgclass = "hide";
jQuery(".imagebox").css("background-image","url("+imgurl+")");
jQuery("img").addClass(imgclass);

jQuery获取每个图像的src属性并将其作为DIV背景

2 个答案: