多個背景圖像IE8

是否有任何jQuery插件（或任何其他方式）強制IE8顯示多個背景圖像？多個背景圖像IE8

來源

2010-12-16 Diego

@mu太短了 - 我不知道該說些什麼。因爲我想擁有多個背景的原因是非常大而廣泛的，我不明白這將如何幫助回答我的問題。 – Diego 2010-12-17 11:19:08

CSS3多背景

這個庫帶來了多背景圖片支持到Internet Explorer 6-8和Firefox < = 3.5，通過從樣式和鏈接標籤中讀取CSS代碼。

CSS3瀏覽器支持擴展到background-image，background-position，background-repeat。這個庫只爲速記風格的背景屬性實現自己的屬性。

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

enter image description here

使用示例

包括腳本

所有需要被列入爲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使用的background屬性

多背景都採用這種Javascript庫讀取。注意如何支持懸停和活動狀態。

#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; 
}

來源

2010-12-17 09:15:05

對於那些需要下載鏈接的人可以在這裏找到：http://www.chicowebdesign.com/blog/2010/10/21/updated-jquery-multiple-background-plug-in/ – 2012-04-04 19:31:57

@Sonner我得到了跟隨着誤差在IE8「頁面錯誤細節信息：對象預期行：7 字符：1 代碼：0 URI：文件：jquery.multiple-bgs.min。JS 消息：預期的對象行：13 字符：1 代碼：0 URI：文件：jquery.multiple-bgs.js – 2012-05-16 12:10:46

@ eric.itzhak和Soner你能爲我定義解決我的問題上述下面 – 2012-05-16 12:12:13

CSS3 PIE可以做你想找的Internet Explorer和傳統的Mozilla Firefox CSS3 PIE

來源

2010-12-17 09:13:19 splatio

css3pie是一個神話般的小黑客，但我不知道它可以做CSS多個背景？ – Spudley 2010-12-17 09:17:20

這不是我以前用過的東西，但是我打算很快。看看這裏的文檔http://css3pie.com/documentation/supported-css3-features/它可以使用-pie-background屬性來完成。 – splatio 2010-12-17 18:24:04

這很好用。只是一個小問題，一定要在實際的IE8瀏覽器中測試 - 如果您嘗試使用IE9的IE8模式，則-pie-background聲明不會執行任何操作。（至少在撰寫本評論時） – 2011-04-25 18:57:19

如果不超過3張圖片作爲背景，你可以在CSS中:before和:after周圍玩耍。例如，請參閱此link。

您可能需要添加在頭下面但如果你想IE7的行爲，以及：

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

來源

2012-07-14 02:41:14 adedoy

多個背景圖像IE8

回答

相關問題