結合背景CSS使用javascript

任何人都知道如何添加CSS背景，而無需用js替換之前的背景？結合背景CSS使用javascript

<div style = "background: url (image.png)"> </ div>

後

例如，添加

<div style = "background: url (image2.png), url (image.png)"> </ div>

來源

2015-02-11 Alan

你想用新的覆蓋以前的圖像嗎？ – rJ7 2015-02-11 06:42:57

你不能同時擁有兩個背景。 – 2015-02-11 06:46:36

@JosanIracheta你可以用CSS3。 – 2015-02-11 09:57:49

這裏是JavaScript解決方案：

var backgroundStyle = document.querySelector("#container").style.background; 
 

 
document.querySelector("#container").style.background = backgroundStyle + ", url('http://res.cloudinary.com/demo/image/upload/sample.jpg')";

<div style = "background: url('http://www.brightlinkprep.com/wp-content/uploads/2014/04/sample.jpg')" id="container" > 
 
</div>

您可以使用開發工具/螢火驗證。

來源

2015-02-11 07:08:08

解決了，謝謝Rahul – Alan 2015-02-11 07:11:24

@Alan請注意，URL應該用你的風格引號。 – 2015-02-11 08:58:53

剛剛得到的背景值，並追加另一URL（img_url）

var my_div= document.querySelector("my_div"); 
if(my_div.style.background == "") 
my_div.style.background= "url(image.png)"; 
else 
my_div.style.background+= ",url(image2.png)";

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_multiple_backgrounds

來源

2015-02-11 06:46:21 Gael

有沒有辦法添加，而沒有獲得前一個背景？ – Alan 2015-02-11 06:52:22

您應該必須測試已經是背景，以瞭解是否需要添加逗號。 – Gael 2015-02-11 06:54:56

我建議你使用類作爲第一個答案。它更乾淨。 – Gael 2015-02-11 06:58:23

您可以使用CSS類並在需要時在類之間切換。

.class_one { 
    background: url (image.png); 
} 

.class_two { 
    background: url (image2.png), url (image.png); 
}

來源

2015-02-11 06:46:44

我需要一個可以使用javascript更改的背景「image2.png」 – Alan 2015-02-11 06:58:53

@Alan，上述解決方案是否存在任何問題？ – 2015-02-11 07:02:00

是的，還不夠 – Alan 2015-02-11 07:05:31

結合背景CSS使用javascript

回答

相關問題