修正 IE 5.5 / 6 不支援 PNG圖片透明背景的問題
因為 GIF格式的圖檔的顏色數量只有 8bit(256色)而已,所以對於顏色的表現或灰階的表現都比較差,所以在處理「漸層」的時候,改用 PNG 來處理漸層就會很漂亮。修正的方法有
1 D: \5 E& a$ |8 V4 v" K# p8 ]7 z5 I' ?
1. 盡量避免用 PNG 透明背景
5 [* b8 y; j4 h0 ~+ K) Y
" V' Y5 Q7 @( g: |2. 透過 AlphaImageLoader 篩選器(filter)修正 IE 5.5 / 6 無法正常顯示 PNG 透明背景的問題。
. N( _4 n8 [ N% d( ^! _9 U2 } 用 PNG 檔案在 Internet Explorer 中不會顯示透明度,但頁面多、圖片多的時候非常累人。
7 _, k7 o' K1 N; t- e3 N( z6 U; H1 h0 s
3. 比較 Smart的方法$ W) v* C0 v; j7 t% t5 i7 h
4 p! q1 u; K1 n, M9 u! g a. Universal transparent-PNG enabler for MSIE/Win 5.5++ q3 t' t S$ R
最常用這個,僅使用 50 行不到的 JavaScript 就可以動態修正 PNG 的問題。但無法解決某些使用 PNG 透明圖檔的情況。
) f2 H j+ Y' B& [/ E1 C/ S. z6 ~$ o+ u- q9 B
b. IE PNG Fix v1.0 / 2.0 Alpha 2/ b; }5 o2 V: t7 x1 F8 [' }' H
這套我有時候會用,但有時候遇到一些較複雜的版面反而會失效,尤其是將 PNG 透明背景圖片用在 CSS 的背景圖屬性(background-image)的時候,但是最近 IE PNG Fix 推出了 2.0 Alpha 2 專門就是用來修正原本 1.0 無法修正的部分,我覺得這點做的很棒。
3 W5 J5 u) @, u3 f4 Z( y
1 ~( V8 X+ x5 Q c. ie7-js8 K/ ^2 `; n( r7 ^4 O& A
功能強大的 ie7-js 提供一組 JavaScript 程式,主要的目的就是希望讓所有 IE 瀏覽器的版本,在顯示(Render)網頁的時候能夠跟在 IE 7 顯示的時候完全一樣。因為 IE 在不同的版本對 HTML 的解譯,以及對 CSS 的解譯上都會有些細微的差異,例如說不同的 HTML 元素(Element)預設的 margin / padding 不一樣的情況。當然,也包括支援 IE 5.5 / 6 不支援 PNG 透明背景的問題。6 n/ | j1 X; ?" b f n/ ]0 A! E8 h
; r- K4 ]3 X1 l7 h7 P
轉貼自這 |