Skip to content

Instantly share code, notes, and snippets.

@megurock
Last active August 29, 2015 14:04
Show Gist options
  • Save megurock/04258e1bec09d3aeaebc to your computer and use it in GitHub Desktop.
Save megurock/04258e1bec09d3aeaebc to your computer and use it in GitHub Desktop.
jquery plugin to appy AlphaImageLoader filter on transparent png images
/* global $, jQuery, window */
(function($) {
/**
*
*/
function applyFilterOnBackgroundImage($node, sizingMethod) {
var regex = /url\(["']*(.*?)["']*\)/;
var src = $node.css("background-image").replace(regex, "$1");
var sizing = (sizingMethod === undefined) ? 'image' : sizingMethod;
if (src !== 'none') {
$node.css({
backgroundImage: "none",
filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '", sizingMethod="' + sizing + '")'
});
}
}
/**
*
*/
function applyFilterOnImage($node, sizingMethod) {
var src = $node.attr('src');
var sizing = (sizingMethod === undefined) ? 'image' : sizingMethod;
if (src.indexOf('.png') !== -1) {
$node.css({
filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '", sizingMethod="' + sizing + '")'
});
}
}
/**
*
*/
function isImageElement($node) {
var isImage, tagName;
try {
tagName = $node.get(0).tagName.toLowerCase();
} catch(error) {}
isImage = (tagName === 'img');
return isImage;
}
/**
*
*/
function applyFilter($node, sizingMethod) {
if (isImageElement($node)) {
applyFilterOnImage($node, sizingMethod);
} else {
applyFilterOnBackgroundImage($node, sizingMethod);
}
}
/**
*
*/
function isLessThanIE9() {
return (typeof window.addEventListener === 'undefined' && typeof document.getElementsByClassName === 'undefined');
}
/**
* @param sizingMethod:String 'image(default)', 'scale' or 'crop'
*/
$.fn.applyAILFilter = function(sizingMethod) {
this.each(function() {
applyFilter($(this), sizingMethod);
});
return this;
}
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment