943,740 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > mouseover Dropdown Menu
Ad:
Permalink
Jul 2nd, 2009
0

mouseover Dropdown Menu

Expand Post »
Been trying to get a mouseover dropdown menu to work when I copy and paste the code all I get is the code where the buttons should be.When it does work I go to preview I get script errors.I am new to this html thing I am using frontpage 2002.This is the code I am trying to use and putting it in the body.I am changing the ahref with my stuff. Thanks
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
  2. "http://www.w3.org/TR/html4/loose.dtd">
  3. <html>
  4.  
  5. <head>
  6.   <LINK REL="StyleSheet" HREF="menu.css">
  7.   <script language="javascript" src="menu.js"></script>
  8. </head>
  9.  
  10. <body>
  11.  
  12.   <h1 align="center">Main Heading</h1>
  13.  
  14.   <table class="navbar" width="800">
  15.     <tr>
  16.       <td class="menuNormal" width="160" onmouseover="expand(this);" 
  17.       onmouseout="collapse(this);">
  18.         <p>Menu 1</p>
  19.         <div class="menuNormal" width="155">
  20.           <table class="menu" width="155">
  21.             <tr><td class="menuNormal">
  22.               <a href="page.htm" class="menuitem">Item 1</a>
  23.             </td></tr>
  24.             <tr><td class="menuNormal">
  25.               <a href="page.htm" class="menuitem">Item 2</a>
  26.             </td></tr>
  27.             <tr><td class="menuNormal">
  28.               <a href="page.htm" class="menuitem">Item 3</a>
  29.             </td></tr>
  30.             <tr><td class="menuNormal">
  31.               <a href="page.htm" class="menuitem">Item 4</a>
  32.             </td></tr>
  33.           </table>
  34.         </div>
  35.       </td>
  36.  
  37.       <td class="menuNormal" width="160" onmouseover="expand(this);" 
  38.       onmouseout="collapse(this);">
  39.         <p>Menu 2</p>
  40.         <div class="menuNormal" width="155">
  41.           <table class="menu" width="155">
  42.             <tr><td class="menuNormal">
  43.               <a href="page.htm" class="menuitem">Item 1</a>
  44.             </td></tr>
  45.             <tr><td class="menuNormal">
  46.               <a href="page.htm" class="menuitem">Item 2</a>
  47.             </td></tr>
  48.             <tr><td class="menuNormal">
  49.               <a href="page.htm" class="menuitem">Item 3</a>
  50.             </td></tr>
  51.             <tr><td class="menuNormal">
  52.               <a href="page.htm" class="menuitem">Item 4</a>
  53.             </td></tr>
  54.           </table>
  55.         </div>
  56.       </td>
  57.  
  58.       <td class="menuNormal" width="160" onmouseover="expand(this);" 
  59.       onmouseout="collapse(this);">
  60.         <p>Menu 3</p>
  61.         <div class="menuNormal" width="155">
  62.           <table class="menu" width="155">
  63.             <tr><td class="menuNormal">
  64.               <a href="page.htm" class="menuitem">Item 1</a>
  65.             </td></tr>
  66.             <tr><td class="menuNormal">
  67.               <a href="page.htm" class="menuitem">Item 2</a>
  68.             </td></tr>
  69.             <tr><td class="menuNormal">
  70.               <a href="page.htm" class="menuitem">Item 3</a>
  71.             </td></tr>
  72.             <tr><td class="menuNormal">
  73.               <a href="page.htm" class="menuitem">Item 4</a>
  74.             </td></tr>
  75.           </table>
  76.         </div>
  77.       </td>
  78.  
  79.       <td class="menuNormal" width="160" onmouseover="expand(this);" 
  80.       onmouseout="collapse(this);">
  81.         <p>Menu 4</p>
  82.         <div class="menuNormal" width="155">
  83.           <table class="menu" width="155">
  84.             <tr><td class="menuNormal">
  85.               <a href="page.htm" class="menuitem">Item 1</a>
  86.             </td></tr>
  87.             <tr><td class="menuNormal">
  88.               <a href="page.htm" class="menuitem">Item 2</a>
  89.             </td></tr>
  90.             <tr><td class="menuNormal">
  91.               <a href="page.htm" class="menuitem">Item 3</a>
  92.             </td></tr>
  93.             <tr><td class="menuNormal">
  94.               <a href="page.htm" class="menuitem">Item 4</a>
  95.             </td></tr>
  96.           </table>
  97.         </div>
  98.       </td>
  99.  
  100.       <td class="menuNormal" width="160" onmouseover="expand(this);" 
  101.       onmouseout="collapse(this);">
  102.         <p>Menu 5</p>
  103.         <div class="menuNormal" width="155">
  104.           <table class="menu" width="155">
  105.             <tr><td class="menuNormal">
  106.               <a href="page.htm" class="menuitem">Item 1</a>
  107.             </td></tr>
  108.             <tr><td class="menuNormal">
  109.               <a href="page.htm" class="menuitem">Item 2</a>
  110.             </td></tr>
  111.             <tr><td class="menuNormal">
  112.               <a href="page.htm" class="menuitem">Item 3</a>
  113.             </td></tr>
  114.             <tr><td class="menuNormal">
  115.               <a href="page.htm" class="menuitem">Item 4</a>
  116.             </td></tr>
  117.           </table>
  118.         </div>
  119.       </td>
  120.     </tr>
  121.   </table>
  122.  
  123. </body>
  124. </html>
Last edited by Tekmaven; Jul 2nd, 2009 at 9:16 pm. Reason: added code | Mod Edit: Code Tags
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
postal07 is offline Offline
2 posts
since Jun 2009
Permalink
Jul 2nd, 2009
0

Re: mouseover Dropdown Menu

.
Last edited by PsychicTide; Jul 2nd, 2009 at 7:13 pm.
Reputation Points: 54
Solved Threads: 15
Junior Poster
PsychicTide is offline Offline
113 posts
since Aug 2008
Permalink
Jul 2nd, 2009
0

Re: mouseover Dropdown Menu

I'm seeing where you classified what tr's will be displayed, but can you show me what script your using (menu.js) and any css you might be using?

My last post I can't seem to erase...
This may be something to check out.. http://javascript-array.com/
Last edited by PsychicTide; Jul 2nd, 2009 at 9:36 pm.
Reputation Points: 54
Solved Threads: 15
Junior Poster
PsychicTide is offline Offline
113 posts
since Aug 2008

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: need help to my css horizontal menu with javascript for IE
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Get the Height of Available Window Space with Javascript





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC