#colorizeImage.js (Demo)

colorizeImage.js is small library for colorizing product images on the client side. It uses HTML5's canvas element if possible and Flash as fallback.

All you need is a white product image, a mask image thereof, and a few hex colors.

[T-Shirt photo borrowed from Wikipedia]

#Usage

##Markup

<div data-base="shirt-base.jpg" data-mask="shirt-mask.jpg" data-swf="../swf/colorizeImage.swf"></div>

• data-base – path to the base image
• data-mask – path to the mask image
• data-swf – path to the swf file

##Invocation

window.colorizeImage(element, hex);

• element – the DOM node
• hex – a 6 character hex color

#Compatibility

• any recent browser
• IE versions as old as 6 (the demo's CSS doesn't work in IE6)