Monday, January 21st, 2008

Effect.wobble and Effect.illuminate: iPhone effects in the browser

Category: JavaScript, Library

Rakuto Furutani has taken inspiration from the iPhone (who hasn’t at this point?) and implemented Effect.wobble and Effect.illuminate to mimic the effects on the iPhone:

javascript

  1. // Effect.wobble
  2. $('img.wobble').each(function(img) {
  3. img.observe('mouseover', function(event) { event.target.wobble({duration: 2, degree: 1.5}) });
  4. });
  5.  
  6. // Effect.illuminate
  7. $('illuminated_msg').illuminate({color: '#fff'});

Effect.wobble and Effect.illuminate

You thought those effects were annoying on your iPhone ;)

Posted by Dion Almaer at 6:37 am
3 Comments

++---
2 rating from 46 votes

3 Comments »

Comments feed TrackBack URI

I guess it’s a nice “Why? Because we can” kind-of-effect but i don’t see any real world usages for this. Plus, the demo kicks my CPU usage from ~5% up to 86% on a 3ghz machine. I’m already sorry for the people who will use this on a slower machine :P

Comment by SchizoDuckie — January 21, 2008

Its a nice effect but…

They are using canvas, so that image is redrawed over and over on each move, also thats not cross platform….

I would rather use SVG\VML image then use the angle attribute of it, it would be smother…

Comment by porf — January 21, 2008

What is really interesting to me is the rotation abilities it introduce. That is pretty nice feature i would like to be able to use more often in my JS animations. Of course it has to be improved in terms of CPU usage but it is a great start.

Comment by sam — January 22, 2008

Leave a comment

You must be logged in to post a comment.