1 | // $Id: jquery.pngFix.js,v 1.1 2010/07/19 22:25:16 danprobo Exp $ |
---|
2 | /** |
---|
3 | * -------------------------------------------------------------------- |
---|
4 | * jQuery-Plugin "pngFix" |
---|
5 | * Version: 1.2, 09.03.2009 |
---|
6 | * by Andreas Eberhard, andreas.eberhard@gmail.com |
---|
7 | * http://jquery.andreaseberhard.de/ |
---|
8 | * |
---|
9 | * Copyright (c) 2007 Andreas Eberhard |
---|
10 | * Licensed under GPL (http://www.opensource.org/licenses/gpl-license.php) |
---|
11 | * |
---|
12 | * Changelog: |
---|
13 | * 09.03.2009 Version 1.2 |
---|
14 | * - Update for jQuery 1.3.x, removed @ from selectors |
---|
15 | * 11.09.2007 Version 1.1 |
---|
16 | * - removed noConflict |
---|
17 | * - added png-support for input type=image |
---|
18 | * - 01.08.2007 CSS background-image support extension added by Scott Jehl, scott@filamentgroup.com, http://www.filamentgroup.com |
---|
19 | * 31.05.2007 initial Version 1.0 |
---|
20 | * -------------------------------------------------------------------- |
---|
21 | * @example $(function(){$(document).pngFix();}); |
---|
22 | * @desc Fixes all PNG's in the document on document.ready |
---|
23 | * |
---|
24 | * jQuery(function(){jQuery(document).pngFix();}); |
---|
25 | * @desc Fixes all PNG's in the document on document.ready when using noConflict |
---|
26 | * |
---|
27 | * @example $(function(){$('div.examples').pngFix();}); |
---|
28 | * @desc Fixes all PNG's within div with class examples |
---|
29 | * |
---|
30 | * @example $(function(){$('div.examples').pngFix( { blankgif:'ext.gif' } );}); |
---|
31 | * @desc Fixes all PNG's within div with class examples, provides blank gif for input with png |
---|
32 | * -------------------------------------------------------------------- |
---|
33 | */ |
---|
34 | |
---|
35 | (function($) { |
---|
36 | |
---|
37 | jQuery.fn.pngFix = function(settings) { |
---|
38 | |
---|
39 | // Settings |
---|
40 | settings = jQuery.extend({ |
---|
41 | blankgif: 'blank.gif' |
---|
42 | }, settings); |
---|
43 | |
---|
44 | var ie55 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 5.5") != -1); |
---|
45 | var ie6 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 6.0") != -1); |
---|
46 | |
---|
47 | if (jQuery.browser.msie && (ie55 || ie6)) { |
---|
48 | |
---|
49 | //fix images with png-source |
---|
50 | jQuery(this).find("img[src$=.png]").each(function() { |
---|
51 | |
---|
52 | jQuery(this).attr('width',jQuery(this).width()); |
---|
53 | jQuery(this).attr('height',jQuery(this).height()); |
---|
54 | |
---|
55 | var prevStyle = ''; |
---|
56 | var strNewHTML = ''; |
---|
57 | var imgId = (jQuery(this).attr('id')) ? 'id="' + jQuery(this).attr('id') + '" ' : ''; |
---|
58 | var imgClass = (jQuery(this).attr('class')) ? 'class="' + jQuery(this).attr('class') + '" ' : ''; |
---|
59 | var imgTitle = (jQuery(this).attr('title')) ? 'title="' + jQuery(this).attr('title') + '" ' : ''; |
---|
60 | var imgAlt = (jQuery(this).attr('alt')) ? 'alt="' + jQuery(this).attr('alt') + '" ' : ''; |
---|
61 | var imgAlign = (jQuery(this).attr('align')) ? 'float:' + jQuery(this).attr('align') + ';' : ''; |
---|
62 | var imgHand = (jQuery(this).parent().attr('href')) ? 'cursor:hand;' : ''; |
---|
63 | if (this.style.border) { |
---|
64 | prevStyle += 'border:'+this.style.border+';'; |
---|
65 | this.style.border = ''; |
---|
66 | } |
---|
67 | if (this.style.padding) { |
---|
68 | prevStyle += 'padding:'+this.style.padding+';'; |
---|
69 | this.style.padding = ''; |
---|
70 | } |
---|
71 | if (this.style.margin) { |
---|
72 | prevStyle += 'margin:'+this.style.margin+';'; |
---|
73 | this.style.margin = ''; |
---|
74 | } |
---|
75 | var imgStyle = (this.style.cssText); |
---|
76 | |
---|
77 | strNewHTML += '<span '+imgId+imgClass+imgTitle+imgAlt; |
---|
78 | strNewHTML += 'style="position:relative;white-space:pre-line;display:inline-block;background:transparent;'+imgAlign+imgHand; |
---|
79 | strNewHTML += 'width:' + jQuery(this).width() + 'px;' + 'height:' + jQuery(this).height() + 'px;'; |
---|
80 | strNewHTML += 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader' + '(src=\'' + jQuery(this).attr('src') + '\', sizingMethod=\'scale\');'; |
---|
81 | strNewHTML += imgStyle+'"></span>'; |
---|
82 | if (prevStyle != ''){ |
---|
83 | strNewHTML = '<span style="position:relative;display:inline-block;'+prevStyle+imgHand+'width:' + jQuery(this).width() + 'px;' + 'height:' + jQuery(this).height() + 'px;'+'">' + strNewHTML + '</span>'; |
---|
84 | } |
---|
85 | |
---|
86 | jQuery(this).hide(); |
---|
87 | jQuery(this).after(strNewHTML); |
---|
88 | |
---|
89 | }); |
---|
90 | |
---|
91 | // fix css background pngs |
---|
92 | jQuery(this).find("*").each(function(){ |
---|
93 | var bgIMG = jQuery(this).css('background-image'); |
---|
94 | if(bgIMG.indexOf(".png")!=-1){ |
---|
95 | var iebg = bgIMG.split('url("')[1].split('")')[0]; |
---|
96 | jQuery(this).css('background-image', 'none'); |
---|
97 | jQuery(this).get(0).runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + iebg + "',sizingMethod='scale')"; |
---|
98 | } |
---|
99 | }); |
---|
100 | |
---|
101 | //fix input with png-source |
---|
102 | jQuery(this).find("input[src$=.png]").each(function() { |
---|
103 | var bgIMG = jQuery(this).attr('src'); |
---|
104 | jQuery(this).get(0).runtimeStyle.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader' + '(src=\'' + bgIMG + '\', sizingMethod=\'scale\');'; |
---|
105 | jQuery(this).attr('src', settings.blankgif) |
---|
106 | }); |
---|
107 | |
---|
108 | } |
---|
109 | |
---|
110 | return jQuery; |
---|
111 | |
---|
112 | }; |
---|
113 | |
---|
114 | })(jQuery); |
---|