Expandable Sliding Links Menu

On the left of this page in yellow is the expandable sliding links menu. Hovering the mouse on top of the word LINKS slides out a links menu. You can add any number of links to the menu to best suit your needs!

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

The script is given below:

This goes in the HEAD of the html file:

(document.getElementById && !document.all) ? dom = true : dom = false;

function moveIt() {
  if (dom) {document.getElementById('linksBox').style.left = parseInt(document.getElementById('linksBox').style.left) + 220 + "px";}
  if (document.all) {document.all["linksBox"].style.pixelLeft = parseInt(document.all["linksBox"].style.pixelLeft) + 220;}
}

function backIn() {
  if (dom) {document.getElementById('linksBox').style.left = parseInt(document.getElementById('linksBox').style.left) - 220 + "px";}
  if (document.all) {document.all["linksBox"].style.pixelLeft = parseInt(document.all["linksBox"].style.pixelLeft) - 220;}
}

function typeStart() {
  if (dom || document.all) {
    document.write('<div id="linksBox" style="position:absolute; left:-225px; top:' + place + 'px; visibility:visible; cursor:hand; cursor:pointer" onmouseover="moveIt()" onmouseout="backIn()">') }
}

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

This goes in the BODY of the html file:

<table border="0" width="210" bgcolor="#ffffff" cellpadding="1" cellspacing="0" class="innerTable">
   <tr><td>
     <div class="theDiv">
      <a href="http://www.microsoft.com/"><b>Microsoft Corp.</b></a>
     </div>
    </td></tr>
   <tr><td>
     <div class="theDiv">
      <a href="http://home.netscape.com/"><b>Netscape Corp.</b></a>
     </div>
    </td></tr>
   <tr><td>
     <div class="theDiv">
      <a href="http://www.macromedia.com"><b>Macromedia Inc.</b></a>
     </div>
    </td></tr>
   <tr><td style="border-bottom: #000000 1px solid">
     <div class="theDiv">
      <a href="http://www.symantec.com"><b>Symantec Corp.</b></a>
     </div>
    </td></tr>
  </table>

</td></tr>
   <tr><td width="210" bgcolor="#c0c0ff">&nbsp;</td>
</tr>
 </table>
<script>typeEnd()</script>