Amazing Image Based Menu Using MooTools
September 26th, 2007phatfusion has developed an awesome image based menu using mootools. Similar to the menu located at http://www.mootools.com; this Image Menu delivers a beautiful user experience.
Some Key Features
- onClick event keeps selected item open.
- Click open item to close.
- Specify a function for the onClick event.
- Auto open when the page loads
See it in action at: http://www.phatfusion.net/imagemenu/index.htm
Previous Post 
Next Post 
Latest Posts
14 Comments
December 6th, 2007 at 12:20 am
can i put a link inside the menu?
so each pic will linked to a page
December 6th, 2007 at 9:36 am
Sure,
Use the following as the onClick function:
function move() {
window.location = ‘http://www.yourdomain.com’
}
or, put an .. around the internal span.
December 10th, 2007 at 11:49 pm
Tommy, your comment got munged by the database somehow, but I did get it via email.
For the benefit of others, I’ve included it below:
thanks Don…
it works now
i have another question:
can it select a pic menu, ie. the second
Yes, you can have it select a specific li on load. That is handled via the start parameter, simply pass it the index you would like it to load. (1 in your example).
December 11th, 2007 at 5:33 am
so, it will be:
http://myurl/?start=1 to load the second li?
i have try that but still no effect
sorry, i still can not make it
*newbie*
December 11th, 2007 at 9:35 am
No, you specify it in the constructor for the menu (JS). Add start:1, to the array of options.
Like this:
var myMenu = new ImageMenu($$(’#kwick .kwick’),{openWidth:200, onClick:demo, start:1});
December 11th, 2007 at 7:01 pm
thanks Don,
now i can do a lot of things using imageMenu
December 24th, 2007 at 9:47 am
Hey Don,
the tag around the span in the list doesn’t work…
or i got it wrong
Nature
happy holidays by the way
December 24th, 2007 at 9:50 am
Hey Don,
the tag around the span in the list doesn’t work…
or i got it wrong
Nature
January 21st, 2008 at 11:48 am
Desipte several attemptes, I remain unable to get it work for me. I would highly appreciate if you give a working demo link for newbies like me. I will be forever thankful to you
January 21st, 2008 at 12:07 pm
my project: http://www.kiosmama.com/2008/
please tell me if there is an easiest way to do
TIA
January 22nd, 2008 at 3:41 am
Look at the source!!! everything you need is in the source….
January 22nd, 2008 at 9:47 am
Thing that works:
People
January 22nd, 2008 at 9:48 am
Thing that works:
[code]
People[/code]
January 24th, 2008 at 12:20 pm
People
Leave a Reply