Monday, July 30th, 2007

YUI-based Image Cropper Widget

Category: Yahoo!

Julien Lecomte of Yahoo! has written a YUI-based image cropper widget that allows you to easily select which region of an image you’d like to crop. This widget works on all A-grade browsers in both standards mode and quirks mode.

Once you setup the CSS and JavaScript you simply:


  1. new YAHOO.widget.ImageCropper( "myImageId" );

Oh, and you probably want to do something with a hook on the backend.

Also, Julien has discussed implementing a scriptable XPCOM Component and an iPhone version of Y! Search.

Posted by Dion Almaer at 4:48 am

2.6 rating from 68 votes


Comments feed TrackBack URI

For people using prototype/scriptaculous, I found a library similar to this one here: JavaScript Image Cropper UI, using Prototype &

Comment by iBram — July 30, 2007

The “defusion” component is really useful, I’ve made some nice works with that ;)

Comment by Napolux — July 30, 2007

Here’s a mootools cropscript:

Comment by Arian — July 30, 2007

Neat! Anything out there for jQuery?

Comment by kumi — July 30, 2007

For Jquery,
From :
Link to Demo :

Comment by Paul — July 30, 2007

I just wish the defusion version would be updated for prototype 1.5.1 and scriptaculous 1.7.1 – it’s a little out of date at this point. :-/

Comment by volve — July 30, 2007

Excellent, just what I’ve been needing (and for YUI too!)

Comment by Mike — July 31, 2007

Extremely neat for back-end on the fly image editing. Generating nice thumbnails becomes really easy with something like this. I’ve custom coded something like this long time ago but I think I’ll adopt this one (or the prototype one.)

Comment by Thomas Colliers — August 2, 2007

Leave a comment

You must be logged in to post a comment.