Topic creation date:2008-06-11
Cascading water at Margaret River Western Australia.
The menu used on this web site is a combination of some fairly extensive CSS and a fairly simple HTML ordered list using <ul> and <li> elements as detailed in the list part of the HTML4.1 specification at the World Wide Web Consortium (W3C).
The HTML for the menu part looks like this.
<li><a class="menubutton" href="./home.html"> Netwiz Home <!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lt IE 7]><table><tr><td><![endif]-->
<li><a href="./home.html"><span class="drop"><span>Netwiz Pty Ltd Home Page</span> </span></a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<li><a class="menubutton" href="./montel.html"> MonTel <!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lt IE 7]><table><tr><td><![endif]-->
<li><a href="./montel.html"><span class="drop"><span>MonTel Call accounting System</span> </span></a></li>
<li><a href="./appnotes/appnotes.html"><span class="drop"><span>MonTel Application Notes</span> </span></a></li>
<li><a href="./montelw.html"><span class="drop"><span>What is MonTel?</span> </span></a></li>
It is generated automatically by Fsetop, and replaces the <menu> marker in the template HTML file. The <!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lt IE 7]><table><tr><td><![endif]--> part is required to allow Microsoft Explorer 5.5 and 6 to use tables to be able to display the rollover. The complexity is in being able to allow IR 7 and greater (though at the time this was written IE8 beta was broken) to work.
In the event you don't need this and just want a plain ordered list, you can select these extras out with some command line switches.
The following is the CSS at the time of publication to generate the above menu. The assumption is that you have some sort of banner which you have set to a height of top:10.5em; with a font size of 1.2em. This can all be changed of course. The CSS code below in placed in the public domain. The images are not, though, it would be sensible in any event to change the look and feel.
The menu as is has been tested and shown to work in the following browsers:
The following are known to fail in some fashion:
Here are the two CSS files (uncompressed) use to generate this page:
This one does the menuing and the basic page layout: main.css.
This one is a heavy variation of the AuthorIt generated stylesheet.css with redundancies removed and changes made here for look and feel rather than in AuthorIt: authorit.css.