Skip to content

Latest commit

 

History

History
35 lines (22 loc) · 1 KB

File metadata and controls

35 lines (22 loc) · 1 KB

#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.

illustration

[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)