When we need to take an image and cut an irregular shape out of it. The only thing to do is to edit image with photoshop and save as a PNG, because it is the only image format used by all web browsers that support alpha channels.

polyClip.js is a script, built on jQuery, that allows us to clip any image withimagemap coordinates using HTML5 Canvas.

For implementation on many images, “how practical would it be to use polyClip.js” is open to discussion however, for only few images, it can be a huge byte-saver.

The library also supports older versions of IE (7-8) using the Excanvas JavaScript library which polyfills canvas using VML.

Requirements: jQuery
Compatibility: All Major Browsers
Website: http://www.useragentman.com/blog/2011/10/29/clipping…
Download: https://github.com/zoltan-dulac/polyClip