Freddie's Spaghetti

“Order One” and “Order Two” are “button-image”
link drop-down menus with two lines of “linked” text each.

1. Above are two Dreamweaver drop-down menus using “button-image” links, with both menus containing two lines of plain text turned into “text” links. The second menu is identical to the first menu except for the “text” that is inserted into each of its two “addMenuItem();” code-lines.

The way to turn plain text into a “text” link is to add a “comma” after the text you have entered (inside of double quotes) between the “addMenuItem();” parentheses, and then add the word “location=” (with an “equal” sign) and the URL of a website, or the “relative path” to another web page on your computer or website (within single quotes)—with both these parts contained within double quotes.


<script type="text/javascript">

// <![CDATA[

function mmLoadMenus() {

if (window.first_menu) return;

window.first_menu = new Menu("root",79,16,"Arial, Helvetica, sans-serif",10,
"#000000","#FFFFFF","#99FFCC","#000000","left","middle",3,0,1000,-5,7,true,true,
true,0,true,true); first_menu.addMenuItem("Spaghetti","location='http://www.osf.com/'"); first_menu.addMenuItem("Little&nbsp;Salad","location='http://www.livestrong.com/
thedailyplate/nutrition-calories/food/little-salad-bar/garden-salad/'"
); window.second_menu = new Menu("root",79,16,"Arial, Helvetica, sans-serif",10,
"#000000","#FFFFFF","#99FFCC","#000000","left","middle",3,0,1000,-5,7,true,true,
true,0,true,true); second_menu.addMenuItem("Ravioli","location='http://www.seriouseats.com/2015/
02/how-to-make-homemade-ravioli-recipe.html'"
); second_menu.addMenuItem("Big&nbsp;Salad","location='http://www.thebigsalad.net/'"); writeMenus(); } // ]]> </script>

[second new Menu() function added] Component 1




<script type="text/javascript">

// <![CDATA[

function mmLoadMenus() {

if (window.first_menu) return;

window.first_menu = new Menu("root",79,16,"Arial, Helvetica, sans-serif",10,
"#000000","#FFFFFF","#99FFCC","#000000","left","middle",3,0,1000,-5,7,true,true,
true,0,true,true); first_menu.addMenuItem("Spaghetti","location='http://www.osf.com/'"); first_menu.addMenuItem("Little&nbsp;Salad","location='http://www.livestrong.com/
thedailyplate/nutrition-calories/food/little-salad-bar/garden-salad/'"); first_menu.writeMenus(); window.second_menu = new Menu("root",79,16,"Arial, Helvetica, sans-serif",10,
"#000000","#FFFFFF","#99FFCC","#000000","left","middle",3,0,1000,-5,7,true,true,
true,0,true,true); second_menu.addMenuItem("Ravioli","location='http://www.seriouseats.com/2015/
02/how-to-make-homemade-ravioli-recipe.html'"); second_menu.addMenuItem("Big&nbsp;Salad","location='http://www.thebigsalad.net/'"); second_menu.writeMenus(); } // ]]> </script>

[writeMenus(); duplication problem] Component 1


A word of caution if you are manually adding another drop-down menu to your “mmLoadMenus()” function: The easiest way (and therefore most common method employed) to create another drop-down menu on a web page is to “copy” the code from the last drop-down menu listed in the “mmLoadMenus()” function and then “paste” that copied-code beneath that last menu's code.

This is where a “duplication problem” can occur: When you “select” the last drop-down menu's code, you may, along with the “addMenuItem();” text line(s), arbitrarily include the “writeMenus();” function-calling command-line from the last drop-down menu!

Then, you will go about changing all of the menu-name “prefixes” on the newly-copied drop-down menu's code to a new menu-name, including changing the “prefix” of the “first_menu.writeMenus();” command-line [as in our example above] to “second_menu.writeMenus();.”

The problem is, there can only be onewriteMenus();” command-line per “mmLoadMenus()” function, and that command-line must come at the end of the “mmLoadMenus()” function.

Here is a typical scenario that can result if there are more than one “writeMenus();” command-lines in your script:

Someone clicks on a “button-image” link or “text” link for a drop-down menu whose associated code is written below another drop-down menu's code that still has its “writeMenus();” command-line intact. Your browser then flies down the “mmLoadMenus()” function faster than Evelyn Wood reading an unpaid-for bestseller at Borders...looking for the chosen menu's code. When the browser comes across the first “writeMenus();” command-line it encounters, it bolts for the external “mm_menu.js” JavaScript file faster than a unhappy bride to her mother's, leaving behind the chosen menu's “description” and “text” information like dirty dishes in the sink!

The chosen menu does not “drop-down”...and there may be an “Error” message down in a browser's Status bar.

That is why leaving the menu-name “prefix” off of the “writeMenus();” calling-function is a good idea. It is a lot easier to spot two, plain “writeMenus();” function command-lines in the same “mmLoadMenus()” function—when one of your drop-down menus isn't working—than it is to distinguish between two “writeMenus();” functions that are each prefixed with a different menu-name.

Now, let's go to Page Four and augment our two drop-down menus, using the Window “open()” Method, to allow a couple of “text”-link URLs to open up in their own “windows,” and two “relative path” web pages to open up in “resizable” windows! We will also discuss how to change a “default” menu setting.

To Top of Page

This page displays properly in Firefox 29.0.1, Google Chrome, and Internet Explorer-9 browsers.