1, to solve the directly with the IMG tag PNG image display
The code is as follows |
Copy Code |
$ (document.body). Fixpng ({scope: ' img '}); |
All PNG pictures in the body can be displayed as transparent.
2, to solve the situation with transparent PNG background picture
The code is as follows |
Copy Code |
$ (' div '). Fixpng (); |
All div tag backgrounds can be converted to PNG transparent
Demonstrate
The code is as follows |
Copy Code |
<script type= "Text/javascript" src= "Jquery-latest.pack.js" ></script> <script type= "Text/javascript" src= "Jquery.pngFix.js" ></script> <script type= "Text/javascript" > $ (document). Ready (function () { $ (document). PngFix (); }); </script> |
Save the following code as a jquery.pngFix.js file, and then import the call
The code is as follows |
Copy Code |
(function ($) {var jspath=$ (' script '). Last (). attr (' src '); var basepath= '; if (Jspath.indexof ('/')!=-1) {basepath+= Jspath.substr (0,jspath.lastindexof ('/') +1);} $.fn.fixpng=function (options) {function _fix_img_png (el,emptygif) {var images=$ (' img[src*= ' png] ', el| | Document), Png;images.each (function () {png=this.src;width=this.width;height=this.height;this.src=emptygif; This.width=width;this.height=height;this.style.filter= "Progid:DXImageTransform.Microsoft.AlphaImageLoader (src= ' +png+ ', sizingmethod= ' scale ') ';} function _fix_bg_png (EL) {var bg=$ (el). css (' background-image '); if (/url ([')]? +.png) [']? /.test (BG)) {var src=regexp.$1;$ (el). css (' background-image ', ' none '); $ (EL). CSS ("filter", "Progid:d XImageTransform.Microsoft.AlphaImageLoader (src= ' +src+ "', sizingmethod= ' scale ')");} if ($.browser.msie&&$.browser.version<7) {return This.each (function () {var opts={scope: ', Emptygif: basepath+ ' Blank.gif '};$.extend (opts,options); switch (opts.scope) {case ' img ': _fix_img_png (this,opts.emptygif); Break;case ' All': _fix_img_png (this,opts.emptygif); _fix_bg_png (this), break;default:_fix_bg_png (this), Break;}}}}) (JQuery); |