function desevent(a) { var b = new String($(this).attr("class")); var c = b.match(/pair_\d+/); $("." + c).hide(); if (a.type == "mouseenter") $("." + c).filter(".color").show().css({ display: "block" }); if ($("." + c).parents(".active").length < 1) { if (a.type == "mouseleave") $("." + c).filter(":not(.color)").show().css({ display: "block" }) } else { $("." + c).filter(".color").show().css({ display: "block" }) } } function initImage(a) { a.onload = null; var b = $(a); if ($.browser.msie) { b = b.desaturateImgFix() } b.addClass("pair_" + ++paircount); var c = b.clone().attr("id", ""); c.get(0).onload = null; c.insertAfter(b).addClass("color").hide(); b = b.desaturate(); b.bind("mouseenter mouseleave", desevent); c.bind("mouseenter mouseleave", desevent) } jQuery.desaturate = { defaults: { onswitch: null, iefix: true, level: 1, rgb: [.3333, .3333, .3333] }, customClass: "js-desaturate-fixed" }; jQuery.desaturate.Image = function (a) { this.image = a; this.canvas = null; this.options = {}; this.jImage = jQuery(this.image); this.jImage.bind("load.desaturate", jQuery.proxy(this.imageLoaded, this)); this.loaded = this.image.complete; this.src = this.jImage.attr("src"); this.isPNG = this.jImage.is("IMG[src$=.png]"); var b = new String(this.jImage.css("width")); b = b.replace(/px/, ""); var c = new String(this.jImage.css("height")); c = c.replace(/px/, ""); this.width = this.jImage.width() ? this.jImage.width() : b ? b : this.jImage.attr("width"); this.height = this.jImage.height() ? this.jImage.height() : c ? c : this.jImage.attr("height"); this.imgFilter = ""; if (this.image.style.filter) { this.imgFilter = "filter:" + this.image.style.filter + ";"; this.image.style.filter = "" } this.image.style.width = ""; this.image.style.height = ""; this.imgId = this.jImage.attr("id") ? 'id="' + this.jImage.attr("id") + '" ' : ""; this.imgClass = 'class="' + this.jImage.attr("class") + " " + jQuery.desaturate.customClass + '" '; this.imgTitle = this.jImage.attr("title") ? 'title="' + this.jImage.attr("title") + '" ' : ""; this.imgAlt = this.jImage.attr("alt") ? 'alt="' + this.jImage.attr("alt") + '" ' : ""; this.imgStyles = this.image.style.cssText; this.imgStyles += this.jImage.attr("align") ? "float:" + this.jImage.attr("align") + ";" : ""; this.imgStyles += this.jImage.parent().attr("href") ? "cursor:hand;" : ""; this.imgStyles = this.imgStyles.replace(/filter:/i, ""); this.imgCssSize = this.width && this.height ? "width:" + this.width + "px;" + "height:" + this.height + "px;" : "" }; jQuery.desaturate.Image.prototype.imageLoaded = function () { this.loaded = true; this.jImage.unbind("load.desaturate"); if (this.canvas) { this.replaceImageWithCanvas(); this.canvas = null } }; jQuery.desaturate.Image.prototype.replace = function (a) { return jQuery(a).replaceAll(this.image).get(0) }; jQuery.desaturate.Image.prototype.prepareCanvas = function () { var a = '<canvas style="display:inline-block;' + this.imgStyles + this.imgCssSize + '" '; a += this.imgId + this.imgClass + this.imgTitle + this.imgAlt + "></canvas>"; this.canvas = jQuery(a).get(0); return this.canvas }; jQuery.desaturate.Image.prototype.switchToCanvas = function () { if (this.loaded && this.canvas) { this.replaceImageWithCanvas(); this.canvas = null } }; jQuery.desaturate.Image.prototype.replaceImageWithCanvas = function () { var a = this.replace(this.getCanvas()); if (typeof this.options.onswitch == "function") this.options.onswitch.call(a) }; jQuery.desaturate.Image.prototype.getCanvas = function () { var a = this.options; var b = this.canvas; var c = b.getContext("2d"); var d = this.width; var e = this.height; b.width = d; b.height = e; c.drawImage(this.image, 0, 0); var f = c.getImageData(0, 0, d, e); for (var g = 0; g < f.height; g++) { for (var h = 0; h < f.width; h++) { var i = g * 4 * f.width + h * 4; var j = f.data[i] * a.rgb[0] + f.data[i + 1] * a.rgb[1] + f.data[i + 2] * a.rgb[2]; f.data[i] = j * a.level + f.data[i] * (1 - a.level); f.data[i + 1] = j * a.level + f.data[i + 1] * (1 - a.level); f.data[i + 2] = j * a.level + f.data[i + 2] * (1 - a.level) } } c.putImageData(f, 0, 0, 0, 0, f.width, f.height); return b }; jQuery.desaturate.Image.prototype.getIeFix = function () { var a = "display:block;background:transparent;padding:0;margin:0;"; var b = '<span style="display:inline-block;' + this.imgStyles + this.imgCssSize + '" '; b += this.imgId + this.imgClass + this.imgTitle + this.imgAlt + ">"; b += '<span style="' + a + this.imgCssSize + this.imgFilter + '">'; if (this.isPNG) { b += '<span style="' + a + this.imgCssSize; b += "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='crop');\">"; b += "</span>" } else { b += '<img style="' + a + this.imgCssSize + '" ' + this.imgTitle + this.imgAlt; b += ' src="' + this.src + '">' } b += "</span>"; b += "</span>"; return jQuery(b).get(0) }; jQuery.fn.desaturate = function (a) { var b = []; var c = jQuery.extend(true, {}, jQuery.desaturate.defaults, a); this.each(function () { var a = this; var d = null; var e = jQuery.extend(true, {}, c, jQuery.metadata ? jQuery(a).metadata() : {}, jQuery(a).data("desaturate")); if (jQuery.browser.msie && jQuery(a).is("IMG") && e.iefix) { d = new jQuery.desaturate.Image(a); d.options = e; a = d.replace(d.getIeFix()) } if (jQuery.browser.msie && (jQuery(a).is("IMG") || jQuery(a).hasClass(jQuery.desaturate.customClass))) { var f = a; if (jQuery(a).hasClass(jQuery.desaturate.customClass)) { f = jQuery("SPAN", a).get(0) } f.style.filter = (f.style.filter ? f.style.filter + " " : "") + "progid:DXImageTransform.Microsoft.BasicImage(grayScale=1)"; if (typeof e.onswitch == "function") jQuery.proxy(e.onswitch, a) } if (!jQuery.browser.msie && jQuery(a).is("IMG")) { d = new jQuery.desaturate.Image(a); d.options = e; a = d.prepareCanvas(); d.switchToCanvas() } b.push(a) }); return this.pushStack(b, "desaturate", "") }; jQuery.fn.desaturateImgFix = function (a) { if (!jQuery.browser.msie) { return this } var b = jQuery.extend(true, {}, jQuery.desaturate.defaults, a); var c = []; this.each(function () { var a = jQuery.extend(true, {}, b, jQuery.metadata ? jQuery(this).metadata() : {}, jQuery(this).data("desaturate")); if (!jQuery(this).is("IMG")) { c.push(this) } else { var d = new jQuery.desaturate.Image(this); d.options = a; c.push(d.replace(d.getIeFix())) } }); return this.pushStack(c, "desaturateImgFix", "") }; var paircount = 0;