JavaScript Menu, DHTML Menu Powered By Milonic




Demo 2



Changing an item property on a few pages only may be accomplished two ways:
1) by placing the function on the page in script tags, the method used here,
2) by placing the function at the top of the menu_data.js file and using a conditional statement,

This section contains demos using the first option by placing the mm_changeItemProperty() function directly on the web page. This might be useful if the change is only wanted on one or two pages. The directions here are for the disable item demo which is provided as a separate menu to use as a model.

Instructions

  1. Download the sample and Unzip the file to its own folder.
  2. Copy your milonic_src.js, mmenudom.js and mmenuns4.js files into the same folder.
  3. Open the disable_item_data.js file
  4. Create your own style with the desired colors, fonts, orientation, position etc.
  5. Add your own items and your own submenus.
  6. Call the file as you would any menu_data.js file.
  7. Place the following function after the call for the menu files on any page you wish to disable the item.

    <script>
    function mm_changeItemProperty(menuName, itemName, codeRef, newValue, updateDisplay)
    {
      menuName = menuName.toLowerCase();
      for (i=0; i<_mi.length; i++)
        if (_mi[i][1].replace(/\ \;/ig,' ') == itemName && _m[_mi[i][0]][1] == menuName) break;
      if (i == _mi.length) return;
      _mi[i][codeRef] = newValue;
      if (updateDisplay) BDMenu(_mi[i][0]);
    }
    mm_changeItemProperty("main menu", "Back", 34, "disabled", 1);
    mm_changeItemProperty("main menu", "Back", 59, "default",1);
    mm_changeItemProperty("main menu", "Back", 5, "#579b63",1);
    </script>

Modifying The Sample

The above function is to disable the Back item. However, this function can be used to change different properties of different items on different pages [or the same page].
function mm_changeItemProperty(menuName, itemName, codeRef, newValue, updateDisplay)
  1. This line tells you it is a function, gives you the function name mm_changeItemProperties()  and the parameters menuName, itemName, codeRef, newValue, updateDisplay [things that must be specified to apply the changes you want to the specific item you want].
    1. Find the menu in which the item you want to change is located. The function allows you to do this by the name you have assigned. - menuName()  In this sample the menu name is 'main menu'
      mm_changeItemProperty("main menu",

    2. Find the item to which you want to apply the change. The function does this by the text of the item. This is case sensitive, meaning it must be exactly like the menu item text. In the sample it is Back.
      mm_changeItemProperty("main menu", "Back",

    3. List the item codeRef, the number assigned to the item property that you want to change. The 1st property to which this sample is applying a change is the type property, codeRef 34. The codeRef for item properties can be found in the Menu Quick Reference Guide Item Properties
      mm_changeItemProperty("main menu", "Back", 34,

    4. Put in the newValue [the change you want to occur]. In the sample we want the type to be disabled.
      mm_changeItemProperty("main menu", "Back", 34, "disabled",

    5. Set whether the change should take place immediately= 1, or not = 0.
      mm_changeItemProperty("main menu", "Back", 34, "disabled", 1);

  2. To apply more than one change to an item, repeat the above process for each change. In the sample there are 3 changes applied to the same item: the type is disabled, the onbgcolor is set to be the same as the offbgcolor, and the mouse pointer is set to default [arrow], preventing it from turning to the hand as it would on mouseover of a link. The result is the 3 lines each calling the function to apply a different change to the item.
    mm_changeItemProperty("main menu", "Back", 34, "disabled", 1); // disables the type i.e link
    mm_changeItemProperty("main menu", "Back", 59, "default",1);  // uses default pointer [arrow]
    mm_changeItemProperty("main menu", "Back", 5, "#579b63",1);   // changes the onbgcolor

  3. Once you have the function as you want, place it inside script tags on the particular page where you want implemented, as noted in 5 above.

The model can be used to apply item property changes to any item. Each menu item in the second menu above has a different change applied. View the source of the related page to see the function. You can also apply changes to more than one item. For example, you might change the offbgcolor for two items.


JavaScript DHTML Popup Menus From Milonic.com JavaScript Menu Courtesy of Milonic.com

Download mm_change_item_property