2015-09-06 72 views
1

請幫我使用jQuery代碼。jQuery獲取每個圖像的src屬性並將其放置爲DIV背景

需要獲取每個圖像(img)屬性並將其放置到div的背景。 我已經有了這一點,但它不是以正確的方式工作:

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

檢查鏈接請:JSFIDDLE

PS

在沒有解決方案的情況下爲每個圖像添加特定的類,因爲列表會變得非常大且動態。

+2

請[edit]添加特定的問題陳述 - 「不起作用」可以假設,但* how *不起作用?什麼錯誤信息或不正確的行爲是特徵? –

回答

1

嘗試這樣

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

    }); 
}); 

JSFIDDLE

+0

是的。圖片的src'this'屬性變量需要在我相信的每一箇中創建。 – sheriffderek

+0

謝謝!它現在的工作:) – Vitality

+0

@Vitality歡迎:) –

0

這是我要做的事。有了這個,圖像將覆蓋整個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); 
相關問題