spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / dhtml / column20 / addendum

Logo

Hierarchical Menus Ver. 2 - Addendum (v2.1)
additional features

Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?

Other Menu URLs

Script URLs

Click the links above to reveal menus.

Click the button above for frame-related mods.

Menu Animated GIF
Animated GIF demonstrating heirarchical menus for non-DHTML browsers.

By now, you will have realized that since we can execute any JavaScript statement(s) from the menu items, we can also issue the:

javascript:parent.location.href='url.html' or
javascript:parent.frameName.location.href='url.html'or
javascript:top.location.href='url.html'or
javascript:top.frameName.location.href='url.html'

statements, loading a page into any frame, frameset or full window.

Well, yes and no. Yes, because that is exactly what we include in the arrays. The menu in the frame example, that appears in a new window when you click the form button in the left column, uses this array:

arMenu1 = new Array(
"Main Frame","inMain.html",0,
"Other Frame",
  "javascript:top.second.location.href='inBot.html'",0,
"Full Frame","javascript:top.location.href='inTop.html'",0
)

No, because a problem arises when linkIt() executes its solitary statement:

    menuLoc.location.href = this.linkText;

Without going into the programming logic, one can visually see that there will be a redundancy. The javascript examples on the previous page read like this, in plain English:

"Load the javascript statement such and such."
or
"Load the javascript function such and such."

Our frame loading statements read like this:

"Load the javascript statement which loads the frame."

The double load is apparent, so we must filter it out in this way:

function linkIt() {
// following line NEW to v2.1
  if (this.linkText.indexOf("javascript")!=-1)
      {eval(this.linkText);return}
  menuLoc.location.href = this.linkText;
}

The linkIt() function now checks for a javascript: protocol in the URL string. If found, the string is executed as a JavaScript statement by evaluating it. Then the function returns. If a javascript: protocol is not found, the function continues normally. This line will capture and execute all JavaScript statements, including the examples from the previous page. This is unecessary, but harmless.

That's it for now. Two additional lines and a lot more functionality. The complete code for Version 2.1 will be repeated on our final code page. Before that, a look at the features to be included in Version 3.


Produced by Peter Belesis and

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business

All Rights Reserved. Legal Notices.
Created: June 29, 1998
Revised: July 24, 1998

URL: http://www.webreference.com/dhtml/column20/addendum/col20add5.html