It is well known that IE6 does not support transparent PNG images, while PNG images are expressive in web design and have less effect than other graphic formats, IE6 this fatal flaw greatly limits the creative play of web design. There are many ways to resolve IE6 transparent PNG, from using IE-specific filters or expression, to javascript+ transparent GIF instead. But these methods have one drawback, The Backgrond-position and Background-repeat properties in CSS are not supported. The use of dd_belatedpng.js can be a perfect solution to IE6 under the PNG image transparency issues, and support Backgrond-position and background-repeat. This is not available in other ways, and Dd_belatedpng also supports a:hover properties, as well as . Our website joins the Dd_belatedpng processing navigation png transparent images, so that they maintain the same appearance under different browsers.
How to use:
First download JS file
0.0.8a.js (uncompressed version)
0.0.8a-min.js (compressed version)
Then reference the code in the page:
1<!–[if IE 6]>
2<script type= "text/javascript" src= "Download down JS path" ></script>
3<script>
4dd_belatedpng.fix (' CSS selector, application type ');
5</script>
6<! [endif]–>
The reference function is Dd_belatedpng.fix (), which fills in parentheses with the CSS selector (which can use the ID selector and class selector) and the application type (divided into IMG and background two) that apply PNG.
such as Dd_belatedpng.fix (' #box-one, img ') or Dd_belatedpng.fix ('. Header, background ') and so on.
These can be abbreviated into Dd_belatedpng.fix (' #box-one,. Header, Img,background '); 。
More selectors such as Dd_belatedpng.fix (' #box-one,. Header, #footer,. Box-two a:hover, Img,background '); Wait a minute.
In addition, to solve the IE6 under the background image flicker, you can add the following script in the page
1 <!–[if IE 6]>
2 <script type= "Text/javascript" >
3//<! [cdata[
4 if ((Window.navigator.appName.toUpperCase (). IndexOf ("MICROSOFT") >=0) && (Document.execcommand))
5 try{
6 Document.execcommand ("Backgroundimagecache", false, true);
7}
8 catch (e) {}
9//]]>
Ten </script>
<! [endif]–>
Use Dd_belatedpng to let IE6 support PNG transparent images