多个背景图像IE8

Question

是否有任何jquery插件(或任何其他方式)强制IE8显示多个背景图像？

Answer 1

适用于Internet Explorer和旧版Mozilla Firefox的CSS3多个背景

该库通过从样式和链接标记中读取CSS代码,将多个背景图像支持到Internet Explorer 6-8和Firefox <= 3.5.

CSS3浏览器支持扩展到背景图像,背景位置,背景重复.此库仅为速记样式的背景属性实现其自己的属性.

http://plugins.jquery.com/project/multiple-bg

示例用法

包括脚本

所有需要包含的是jQuery库和这些脚本,以使这些功能起作用.无需额外的Javascript编码.缩小的图书馆只有8.7kB!

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.multiple-bgs.js"></script>

编写CSS

使用此Javascript库读取使用background属性的多个背景.请注意如何支持悬停和活动状态.

#ex1 {
    background: url(middle.gif) repeat-x 0 0; /* For unsupported browsers */
    background: url(left.gif) no-repeat 0 0, /* For CSS3 Browsers */
                url(right.gif) no-repeat 100% 0, 
                url(middle.gif) repeat-x 0 0;
}
#ex1:hover {
    background: url(middle-hover.gif) repeat-x 0 0; /* For unsupported browsers */
    background: url(left-hover.gif) no-repeat 0 0, /* For CSS3 Browsers */
                url(right-hover.gif) no-repeat 100% 0, 
                url(middle-hover.gif) repeat-x 0 0;
}
#ex1:active {
    background: url(middle-active.gif) repeat-x 0 0; /* For unsupported browsers */
    background: url(left-active.gif) no-repeat 0 0, /* For CSS3 Browsers */
                url(right-active.gif) no-repeat 100% 0, 
                url(middle-active.gif) repeat-x 0 0;
}

Answer 2

CSS3 PIE可能会做你想要的CSS3 PIE

Answer 3

如果它不超过3张图像作为背景,你可以在css 周围:before和周围玩游戏:after.例如,请参阅此链接.

如果你想让ie7表现得好,你可能需要在头部添加以下内容:

<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>