Blurring fisheye effect on a vertical text menu

Question

I'm searching for existing scripts that will animate a vertical text menu by blurring text and zooming it according to the mouse pointer.

I'm trying to accomplish these actions:
1. OS X-like movement on mouse hover that can 'zoom' the text in and out
2. In an un-focused state, the text would be blurred
3. When a user moved their pointer closer to the text, the text would sharpen.

Here's a flash example that demonstrates some of the effects, but I'd really prefer to use javascript. [edit] and not use 'down', 'up' and 'select' buttons… naturally.
http://www.flashden.net/item/vertical-fisheye-menu/19994

Answer 1

Here is an open source script that I think could work for you (Or at least after minor modifications)

http://marcgrabanski.com/pages/code/fisheye-menu

And a tutorial on using it: http://simply-basic.com/tools/fisheye-menu-for-your-website/

Edit:

I realized that the script above probably wouldn't handle text very well. Unfortunately blurring text is not easily done in javascript. It might be possible using the canvas element, but I was unable to find anything in a quick Google search and this would likely not be compatible with older browsers.

Here is another script that has a fisheye effect on text items in a list: http://aleph-null.tv/article/20080522-1839-265.xml/Text-based-Fish-Eye-Effect. This is probably closer to what you're looking for, but it's definitely not as smooth and doesn't allow you to blur text like flash does.

Answer 2

I'm not sure that you can do this in Javascript...