Hiermenus Go Forth, XXIII - DHTML Lab | 4 | WebReference

Hiermenus Go Forth, XXIII - DHTML Lab | 4


Logo

Hiermenus Go Forth, XXIII:
Version 4.1.1 - The Complete Script (Full-Window)



This is a sample HTML Page that includes three menu trees (LoadMe.html in the download). The top-level menus can be permanently visible or popup. The initial script defining event and dummy functions is for non-menu-compliant browsers. The Page Parameters are optional and override Global settings set in the HM_Loader.js external script.

View this page in a new window.

<HTML>
<HEAD>
<TITLE>HM Version 4.1 Examples</TITLE>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
if(window.event + "" == "undefined") event = null;
function HM_f_PopUp(){return false};
function HM_f_PopDown(){return false};
popUp = HM_f_PopUp;
popDown = HM_f_PopDown;
//-->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.2" TYPE="text/javascript">
<!--
HM_PG_MenuWidth = 150;
HM_PG_FontFamily = "Arial,sans-serif";
HM_PG_FontSize = 10;
HM_PG_FontBold = 0;
HM_PG_FontItalic = 0;
HM_PG_FontColor = "blue";
HM_PG_FontColorOver = "white";
HM_PG_BGColor = "#DDDDDD";
HM_PG_BGColorOver = "#FFCCCC";
HM_PG_ItemPadding = 3;
HM_PG_BorderWidth = 2;
HM_PG_BorderColor = "black";
HM_PG_BorderStyle = "solid";
HM_PG_SeparatorSize = 2;
HM_PG_SeparatorColor = "#d0ff00";
HM_PG_ImageSrc = "HM_More_black_right.gif";
HM_PG_ImageSrcLeft = "HM_More_black_left.gif";
HM_PG_ImageSrcOver = "HM_More_white_right.gif";
HM_PG_ImageSrcLeftOver = "HM_More_white_left.gif";
HM_PG_ImageSize = 5;
HM_PG_ImageHorizSpace = 0;
HM_PG_ImageVertSpace = 2;
HM_PG_KeepHilite = true; 
HM_PG_ClickStart = 0;
HM_PG_ClickKill = false;
HM_PG_ChildOverlap = 20;
HM_PG_ChildOffset = 10;
HM_PG_ChildPerCentOver = null;
HM_PG_TopSecondsVisible = .5;
HM_PG_ChildSecondsVisible = .3;
HM_PG_StatusDisplayBuild =1;
HM_PG_StatusDisplayLink = 1;
HM_PG_UponDisplay = null;
HM_PG_UponHide = null;
HM_PG_RightToLeft = false;
HM_PG_CreateTopOnly = 1;
HM_PG_ShowLinkCursor = 1;
HM_PG_NSFontOver = true;
//HM_a_TreesToBuild = [1,2];
//-->
</SCRIPT>
</HEAD>
<BODY>

<BLOCKQUOTE>
<H3>Sample HTML page with 5 Hierarchical Menus</H3>
<P>Permanent Centered Menu (Cascades on <I>click</I>):</P>
<BR><BR>
<P>Permanent Horizontal Variable-Width Menu (Cascades on <I>mouseover</I>):</P>
<BR><BR>
<P><A HREF="http://hiermenuscentral.com/aLinkForOldBrowsersGoesHere.html"
      onMouseOver="HM_f_PopUp('elMenu1',event)"
      onMouseOut="HM_f_PopDown('elMenu1')">
          Relative-to-Mouse-Position Popup Menu (Displays on <I>mouseover</I>)</A></P>
<BR>
<P><A HREF="http://hiermenuscentral.com/aLinkForOldBrowsersGoesHere.html"
      onMouseOver="HM_f_PopUp('elMenu4',event)"
      onMouseOut="HM_f_PopDown('elMenu4')">
          Relative-to-Mouse-Position Using Keywords Popup Menu (Displays on <I>click</I>)</A></P>
<BR>
<P><A HREF="http://hiermenuscentral.com/aLinkForOldBrowsersGoesHere.html"
      onMouseOver="popUp('HM_Menu3',event)"
      onMouseOut="popDown('HM_Menu3')">
          Absolute Position Popup Menu (Displays on <I>mouseover</I>)</A></P>
</BLOCKQUOTE>
<SCRIPT LANGUAGE="JavaScript1.2"
        SRC="HM_Loader.js"
        TYPE='text/javascript'></SCRIPT>
</BODY>
</HTML>

On the next page, the HM_Loader.js external file.


Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: October 2, 2001
Revised: October 2, 2001

URL: http://www.webreference.com/dhtml/column59/4.html