Fisheye Menu Using AS3 and TweenLite
A friend of mine that enjoys bitching until I help her with whatever popped into her head that moment messages me tonight. “Hey for my site [that you’ll make for me for free because i’m a girl and your friend] I want a menu system like that one I showed you [which you’re supposed to magically remember out of all the sites you’ve seen on the whole internet in your life].” After she re-sent me the link, a beautiful site called ilovedust I took a look at the slick little fish-eye style menu and said, “Yeah that’s Animation, I do code. Not pretty stuff like that.”
After 5 minutes of receiving complaining message (but mostly once my game was finished that I was playing at Kongregate, I actually thought about what was happening in that menu, and after about 20 minutes of coding, had a workable menu. I thought I’d post the code here and make a little tutorial out of it.
I love TweenLite. And TweenMax. And pretty much everything at GreenSock. Once you learn the class, it makes everything so easy. For those that are here who are AS2 coders… a) Upgrade! and b) They also have AS2 versions of all of their code. There are a number of other Tween libraries to choose from. Some perform better than others. But TweenLite was the first for me that ‘made sense’ in my budding AS3 days, which still continue.
This is a quick little example of making a 5 menu-item menu that does stuff when you mouse-over. You could probably think of a million ways to optimize this code; putting the menu items in a loop to initialize and things like that. I’m just going to lay it out, and you can make your own better.