Principle
This JS plugin uses Microsoft's VML language for rendering, while most other JS plug-ins that solve the PNG problem use the AlphaImageLoader filter.
How to use
1. Download the Dd_belatedpng.js file here.
http://dillerdesign.com/experiment/DD_belatedPNG/#download
2. Refer to the Web page as follows:
code is as follows |
copy code |
<!--[if IE 6]> <script src= "dd_belatedpng.js" mce_src= "Dd_belatedpng.js" ></SCRIPT> <script type= " Text/javascript "> /* EXAMPLE */ Dd_belatedpng.fix ('. Png_bg '); &NBSP /* converts. PNG_BG to a CSS selector that you applied transparent PNG, such as the '. Trans ' */ in my example, </script> <![ endif]--> |
3. There are 2 kinds of call functions, one is Dd_belatedpng.fix (), as above code. The other is fix (), which requires the CSS selector name to be indicated within the function.
Please pay attention to the use of a:hover
5-25 Update: If you want to use transparent PNG as a background image for a:hover as well as Jutoy, then you need to pay attention to your code and use "A:hover" as your selector. Failure to do so may result in unsuccessful results. At the same time I also updated the demo, please need to update the view. And then we look at the correct code:
The code is as follows |
Copy Code |
<!--[if IE 6]> <script type= "Text/javascript" src= "Js/dd_belatedpng.js" ></script> <script type= "Text/javascript" > Dd_belatedpng.fix ('. Trans,.box a:hover '); </script> <! [endif]--> |
We just need to add this code to the beginning of the file.
The code is as follows |
Copy Code |
<!--[if IE 6]> <script type= "Text/javascript" src= "Js/dd_belatedpng.js" ></script> <script type= "Text/javascript" > Dd_belatedpng.fix ('. Trans,.box a:hover '); </script> <! [endif]--> |
It is easy to solve the IE6 png opaque method.