使用img src作為背景圖像

Question

我正在嘗試在使用媒體查詢時將img src用作背景圖像。

最大寬度：854像素時，我的媒體查詢處於活動狀態。

我正在嘗試使用jQuery，但無法正常工作。

我的jQuery：

$(document).ready(function () {
        if ($(window).width() <= 854) {
            $('a.class').css('background-image', 'url(' + $('a.class img').attr(src) + ')');
        }
    });

我究竟做錯了什么？

謝謝！

Answer 1

使用jQuery進行此操作，您可能需要這樣做：

$(document).ready(function () {
    if ($(window).width() <= 854) {
        $('a.class').each(function(){
            $(this).css('background-image', 'url(' + $(this).children('img').attr('src') + ')');
        });
    }
});

我使用了each循環，因為我猜您可能有多個a.class並且對src屬性使用了引號。

Answer 2

更改

$('a.class').css('background-image', 'url(' + $('a.class img').attr(src) + ')');

至

$('a.class').css('background-image', 'url(' + $('a.class img').attr('src') + ')');

.attr函數需要一個字符串。 您需要用引號引起來，因為src是屬性的名稱。

如果您按照Juan的建議檢查瀏覽器的控制台中的錯誤，則可能會發現此錯誤。 或者，如果您查看IDE中突出顯示的語法，您會發現src顏色像變量名而不是字符串值。

Answer 3

$（'a.class'）。css（'background-image'，'url（'+ $（'a.class img'）。attr（“ src”）+'）'）;

“ src”必須在引號之間。