NlsMenu Pro
addobject.com
Menu Effect
NlsMenu Professional - Advanced Javascript Drop Down Menu Control
   

NlsMenu supports cross browsers effects (sliding and fading) and all IE 5.5+ transition effects. You can configure the effect by specifying default effect on menu manager level (apply to all menus managed by the menu manager ) or effect on menu level. Below are steps to enable and configure NlsMenu effect:

1. Includes the nlsmenueffect.js script

Include the script in your page <head> section.


            <head>
            <script language="javascript" src="nlsmenu/nlsmenueffect.js" ></script>
            </head>
          


2. Specifying Default Effect

Default effect applies to all menus (menubar/submenus) created within a menu manager (NlsMenuManager).


            var menuMgr = new NlsMenuManager("manager");
            menuMgr.defaultEffect="fade";
          


3. Specifying Menu Level Effect

Menu level effect applies to a particular menu only. Use useEffect() function to specify menu level effect.


            var menuMgr = new NlsMenuManager("manager");

            //default effect, applies to all menus created within the menu manager.
            menuMgr.defaultEffect="fade";

            var prodMenu = menuMgr.createMenu("products");

            //specify menu level effect.
            prodMenu.useEffect("gradienwipe");
          


4. Item Effect

You can specify effect when mouse move over a menu item. To specify item effect:


            var prodMenu = menuMgr.createMenu("products");
            prodMenu.defItmEff="itemfade";
          


5. Predefined Effects

Below are predefined effects you can use.

barnblindscheckerboard
fadeinsetiris
pixelateradialwiperandombars
randomdissolveslidespiral
stretchstripswheel
gradienwipezigzagitemfade
itemdissolveaoslide 


6. Customizing the effects

You can customize the effect by modifying predefined effects or adding new effects. Simply customize the nlsEffectList definition in nlsmenueffect.js file.
For example:


              var nlsEffectList={
              .....
                fade1:"progid:DXImageTransform.Microsoft.Fade(Duration=1.0,Overlap=1.00);",
              .....
              }