Created
July 6, 2012 16:55
-
-
Save ricardovf/3061306 to your computer and use it in GitHub Desktop.
PNGfixIE6
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| jQuery.fn.supersleight = function(settings) { | |
| settings = jQuery.extend({ | |
| imgs: true, | |
| backgrounds: true, | |
| input_src: true, | |
| shim: ‘data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAAAAAA6fptVAA AACXZwQWcAAAABAAAAAQDH lV/tAAAAAnRSTlMA/1uRIrUAAA AKSURBVAjXY/gPAAEBAQAbtu 5WAAAAAElFTkSuQmCC’, | |
| apply_positioning: true | |
| }, settings); | |
| return this.each(function(){ | |
| if (jQuery.browser.msie && parseInt(jQuery.browser.version, 10) < 7 && parseInt(jQuery.browser.version, 10) > 4) { | |
| jQuery(this).find('*').andSelf().each(function(i,obj) { | |
| var self = jQuery(obj); | |
| // background pngs | |
| if (settings.backgrounds && self.css('background-image').match(/\.png/i) !== null) { | |
| var bg = self.css('background-image'); | |
| var src = bg.substring(5,bg.length-2); | |
| var mode = (self.css('background-repeat') == 'no-repeat' ? 'crop' : 'scale'); | |
| var styles = { | |
| 'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + mode + "')", | |
| 'background-image': 'url('+settings.shim+')' | |
| }; | |
| self.css(styles); | |
| }; | |
| // image elements | |
| if (settings.imgs && self.is('img[src$=png]')){ | |
| var styles = { | |
| 'width': self.getSupersleightWidth({margin:false}) + 'px', | |
| 'height': self.getSupersleightHeight({margin:false}) + 'px', | |
| 'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + self.attr('src') + "', sizingMethod='scale')" | |
| }; | |
| self.css(styles).attr('src', settings.shim); | |
| }; | |
| // input image elements with src | |
| if (settings.input_src && self.is('input[src$=png]')){ | |
| var styles = { | |
| 'width': self.getSupersleightWidth({margin:false}) + 'px', | |
| 'height': self.getSupersleightHeight({margin:false}) + 'px', | |
| 'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + self.attr('src') + "', sizingMethod='scale')" | |
| }; | |
| self.css(styles).attr('src', settings.shim); | |
| }; | |
| // apply position to 'active' elements | |
| if (settings.apply_positioning && self.is('a, input, label') && (self.css('position') === '' || self.css('position') == 'static')){ | |
| self.css('position', 'relative'); | |
| }; | |
| }); | |
| }; | |
| }); | |
| }; | |
| $.fn.getSupersleightHeight = function(arguments) { | |
| arguments = $.extend({ | |
| border: true, | |
| margin: true, | |
| padding: true | |
| }, arguments); | |
| if (!$(this).exists()) { | |
| return 0; | |
| } | |
| var totalHeight = ($(this).height()>0)?$(this).height():$(this).css("height").replace(/px/g,""); | |
| var borderHeight = parseInt($(this).css("borderTopWidth")) + parseInt($(this).css("borderBottomWidth")); | |
| var marginHeight = parseInt($(this).css("margin-top")) + parseInt($(this).css("margin-bottom")); | |
| var paddingHeight = parseInt($(this).css("padding-top")) + parseInt($(this).css("padding-bottom")); | |
| if (arguments.border && borderHeight > 0) { | |
| totalHeight -= borderHeight; | |
| } | |
| if (arguments.margin && marginHeight > 0) { | |
| totalHeight -= marginHeight; | |
| } | |
| if (arguments.padding && paddingHeight > 0) { | |
| totalHeight -= paddingHeight; | |
| } | |
| return totalHeight; | |
| } | |
| $.fn.getSupersleightWidth = function(arguments) { | |
| arguments = $.extend({ | |
| border: true, | |
| margin: true, | |
| padding: true | |
| }, arguments); | |
| if (!$(this).exists()) { | |
| return 0; | |
| } | |
| var totalWidth = ($(this).width()>0)?$(this).width():$(this).css("width").replace(/px/g,""); | |
| var borderWidth = parseInt($(this).css("borderLeftWidth")) + parseInt($(this).css("borderRightWidth")); | |
| var marginWidth = parseInt($(this).css("margin-left")) + parseInt($(this).css("margin-right")); | |
| var paddingWidth = parseInt($(this).css("padding-left")) + parseInt($(this).css("padding-right")); | |
| if (arguments.border && borderWidth > 0) { | |
| totalWidth -= borderWidth; | |
| } | |
| if (arguments.margin && marginWidth > 0) { | |
| totalWidth -= marginWidth; | |
| } | |
| if (arguments.padding && paddingWidth > 0) { | |
| totalWidth -= paddingWidth; | |
| } | |
| return totalWidth; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment