Monday, February 6th, 2006

iPhoto-like image resizing using Javascript

Category: Ajax, JavaScript, Programming

In a post from the Aglie Partners’ weblog, John Berry shows how, with the help of Prototype and script.aculo.us, you can use Javascript to create an “iPhoto-like image resizing” tool.

Upon seeing the Fluxiom intro video, I was compelled to figure out how they pulled off iPhoto-like image scaling in a browser. Leveraging the work of others, it’s actually very simple.

If you use the script.aculo.us slider control to capture input values, it’s really just a matter of converting those values into something useful and modifying styles.

Included in the post is an example of the script at work, using a slider to resize six pictures simantaneously contained in a DIV that adjusts to their fluid sizes well. After the example comes the good stuff – the instructions and code to get this fun little tool working. He notes that there are still some issues with it, but it’s fluid in most major browsers. There’s similar functionality seen over on the BubbleShare site…

iPhoto Resizing

Posted by Chris Cornutt at 9:19 am
1 Comment

+++--
3.8 rating from 111 votes

1 Comment »

Comments feed TrackBack URI

I’d better wait for http://smartimagine.com

Comment by Robert — February 7, 2006

Leave a comment

You must be logged in to post a comment.