[SmartMenus 6 add-on]
This sample demonstrates how you can apply various reveal animation effects (cross-browser) for opening the sub menus.
For the purpose you need to use a small add-on script.
Use the following select box to apply and see the different reveal effects you could use.
Using the Reveal Animation add-on is really simple - just link the small JS file on your page after the link to the SmartMenus script core (c_smartmenus.js) file. This is all you need to do - the add-on script will automatically apply the chosen reveal animation effect to all sub menus you may have on the page.
You will find the following variables that could be used to customize the reveal animation effect in the add-on (the "c_addon_fx_slide.js" file):
c_reveal_steps=10;
c_reveal_speedGain=0.2; // with each step (pixels)
c_reveal_direction=3; // Possible values:
// 1-auto-vertical/horizontal, 2-auto-diagonal, 3-box-inside-out,
// 4-top-bottom, 5-bottom-top, 6-left-right, 7-right-left,
// 8-diagonal-bottom-right, 9-diagonal-bottom-left,
// 10-diagonal-top-right, 11-diagonal-top-left
When c_reveal_direction is set to 1 or 2 (i.e. "auto-vertical/horizontal" or "auto-diagonal") the script will automatically detect the reveal direction for each sub menu.
This add-on is supported in all browsers that are fully supported by the SmartMenus 6 script with the following exceptions:
Please note the following:
You can download the complete example or just see the configuration file and the images used for it.