Sandeep's Nook: JavaScript Page

Always On Top Links Menu With Sub-links

Similar to the Always On Top Links Menu script except that here there is a provision to add sub-links. The menu seen in the yellow band above always stay on top even if you scroll down the page. Hovering the mouse over the Other Links option would drop a menu with more links.

Author: Sandeep Gangadharan
Home Page: http://www.sivamdesign.com/scripts/

The script is given below:

This goes in the HEAD of the html file:

function typeStart() {
  if (dom) { document.write('<div id="linksBox" style="position:absolute; left:0; visibility:show; border:1px solid #000000">') } }

function typeEnd() { if (dom) { document.write('</div>') } }

Note the script in the BODY tag:

<body onLoad="placeIt()">

This goes in the BODY of the html file:

<layer id="linksBox1" style="position:absolute; width:98%; visibility:visible">
<script>typeStart()</script>
<div class="bubble" style="width:100%; background-color:yellow">

<span><a href="http://www.microsoft.com/" class="link"><b>Microsoft Corp.</b></a></span>
<span><a href="http://home.netscape.com/" class="link"><b>Netscape Corp.</b></a></span>
<span><a href="http://www.macromedia.com" class="link"><b>Macromedia Inc.</b></a></span>
<span><a href="http://www.symantec.com" class="link"><b>Symantec Corp.</b></a></span>

<span><a href="#" class="link"><b>Other Links</b><font face="arial"> &#9660;</font></a>
  <table border="0" width="120" bgcolor="black" cellspacing="1" cellpadding="2" style="line-height:10px"><tr><td>
    <tr><td bgcolor="yellow"><a href="http://www.sivamdesign.com/home/index.html">Home</a></td></tr>
    <tr><td bgcolor="yellow"><a href="http://www.sivamdesign.com/scripts/index.html">JavaScript Page</a></td></tr>
    <tr><td bgcolor="yellow"><a href="http://www.sivamdesign.com/home/fitness/index.html">Fitness Page</a></td></tr>
    <tr><td bgcolor="yellow"><a href="http://www.sivamdesign.com/home/quotes/index.html">Quotes Page</a></td></tr>
    <tr><td bgcolor="yellow"><a href="http://www.sivamdesign.com/home/files/site_map.html">Site Map</a></td></tr>
  </table>
 
</span>

</div>