Old version is now redundant! Please upgrade to this new version.
multiBox is a reworked version of Phatfusion´s brilliant multibox so that it will work with MooTools 1.2. There are many extra options including the option to group elements!
Just add a group surrounded by square brackets and the script will only navigate between those with the same group.
You add the group in the links ‘rel’ tag. ie: rel="[group_one]".
On this page, the images are grouped, the flash files are grouped, and the videos are grouped. If no group is specified, multiBox treats the link as a single object and navigation buttons will be disabled.
Another point worth mentioning: you can now override the description on single multiBox element by simply adding ‘noDesc’ into the ‘rel’ tag. ie: rel="noDesc" or if you have more than one ‘rel’ value already rel="[group_one],noDesc". This adds flexibility so you are not tied to either using/or not using descriptions on all elements. The second image on this page is using this feature.
For accessibility & usability purposes, I have also added keyboard shortcuts. "spacebar" or "right" = next, "left" = previous and finally "esc" = close. Someone pointed out to me that the overlay doesn´t fade away in the same way as it fades in. I have sorted that issue with a simple chain.
MooTools has a built in ‘Tips’ class. This is simply a more stylish way of displaying an elements title tag (plus more if you wanted to expand but I have left it as purely the title tag). Because the code is already in the MooTools library, I thought I may as well include this feature. There is the option to disable it of course.
People keep asking me how they can get multiBox to automatically open on pageload. Well it´s easy! There is an option in the usage called autoOpen, set to 1 to open the 1st element, 2 to open the 2nd etc. Keep at 0 to keep this option inactive.
This is a snippet of html.