通过jQuery添加另一个背景图像 [英] Add another background image via jquery

问题描述

我想在div元素中添加另一个背景图片，但是我不想简单地覆盖现有的背景图片，我想拥有多个背景，因此应该在第一个背景图片下方添加新的背景网址.

I would like to add another background image to my div element, however I dont want to simply write over the existing one, I would like to have multiple backgrounds, so it should add the new background url below the first.

这是原始CSS的外观.

Here is the what the original CSS will look like..

#cover-art {
    background:
        url('http://beta.mysite.net/img/banner1.png') top left no-repeat,
    padding:250px 0 0;
}

我想通过jquery做的是在第一个这样的第一个下面添加另一个图像url行...

What I would like to do via jquery is add another image url line below the first one like this...

#cover-art {
    background:
        url('http://beta.mysite.net/img/banner1.png') top left no-repeat,
            url('http://beta.mysite.net/img/banner2.png') top left no-repeat,
    padding:250px 0 0;

}

还要注意的是#cover-art css在外部样式表中.

Also something to note is that #cover-art css is in an external style sheet.

推荐答案

在这里.请记住，这不适用于已经使用了两年以上的许多浏览器:

Here you go. Keep in mind this won't work with a lot of browsers that are more than a couple years old:

var _oCurr = jQuery('#cover-art');
var _sBg = _oCurr.css('background-image');
_oCurr.css('background-image', _sBg + ', url(/img/banner2.png)');

这篇关于通过jQuery添加另一个背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！