login  Naam:   Wachtwoord: 
Registreer je!
 Forum

rollovermenu werkt niet goed in Firefox en Opera (Opgelost)

Offline tbel - 09/02/2009 15:38 (laatste wijziging 10/02/2009 11:35)
Avatar van tbelNieuw lid Beste ...,

Ik ben bezig met een rollovermenu, als ik deze test in IE werkt het perfect, maar als ik het test in Firefox en Opera kom ik wat problemen tegen. http://www.sb-creations.nl/TEST/menu.php
Bij Firefox komt het menu wel horizontaal in beeld, maar bij de submenu's wordt de tekst in elkaar gepropt.
Bij Opera komt het menu niet eens horizontaal in beeld, maar verticaal.
Hebben jullie enig idee wat er verkeerd gaat?

Hierbij mijn scripts:
PHP:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Untitled Document</title>
  6. <link rel="stylesheet" type="text/css" href="jqueryslidemenu.css"/>
  7.  
  8. <!--[if lte IE 7]>
  9. <style type="text/css">
  10. html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/
  11. </style>
  12. <![endif]-->
  13.  
  14. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
  15. <script type="text/javascript" src="jqueryslidemenu.js"></script>
  16.  
  17. </head>
  18.  
  19. <body>
  20. <div id="myslidemenu" class="jqueryslidemenu">
  21. <ul>
  22. <li><a href="index.php" class="jqueryslidemenu">home</a></li>
  23. <li><a href="werk.php" class="jqueryslidemenu">werk</a></li>
  24. <li><a href="activity.php" class="jqueryslidemenu">activity</a>
  25.   <ul>
  26.   <li><a href="#">sub item</a></li>
  27.   <li><a href="#">sub item</a></li>
  28.   <li><a href="#">sub item</a></li>
  29.   <li><a href="#">sub item</a></li>
  30.   </ul>
  31. <li><a href="organisatie.php" class="jqueryslidemenu">organisatie</a>
  32.   <ul>
  33.   <li><a href="structuur.php">structuur</a></li>
  34.   <li><a href="directie.php">directie</a></li>
  35.   <li><a href="partners.php">partners</a></li>
  36.   </ul>
  37. </li>
  38.   <li><a href="klanten.php" class="jqueryslidemenu">klanten</a></li>
  39.   <li><a href="contact.php" class="jqueryslidemenu">contact</a></li>
  40.   <li><a href="route.php" class="jqueryslidemenu">route</a>
  41.   <ul>
  42.   <li><a href="plattegrond.php">plattegrond</a></li>
  43.   <li><a href="tomtom.php">tomtomadres</a></li>
  44.   </ul>
  45.   </li>
  46. </li>
  47. </ul>
  48. <br style="clear: left" />
  49. </div>
  50.  
  51. </body>
  52. </html>


Javascript:
Plaatscode: 91349

CSS:
Plaatscode: 91350

7 antwoorden

Gesponsorde links
Offline mothh - 09/02/2009 16:36
Avatar van mothh Onbekend ik heb wel een nieuw soort gelijk menu voor je werkt ook perfect:
weet jij misschien hoe je een menu horizontaal krijgt in ie?


php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head><title></title>
  4. <style type="text/css" title="style" media="screen, projection">
  5. ul {
  6.   padding: 0;
  7.   margin: 0;
  8.   list-style: none;
  9.   }
  10. li {
  11.   float: left;
  12.   position: relative;
  13.   width: 100px;
  14.   }
  15. li ul {
  16.   display: none;
  17.   position: absolute; 
  18.   top: 1em;
  19.   left: 0;
  20.   }
  21. li > ul {
  22.  top: auto;
  23.  left: auto;
  24.  }
  25. li:hover ul, li.over ul{ display: block; }
  26. </style>
  27. <script type="text/javascript">
  28. function startList() 
  29. {
  30. if (document.all && document.getElementById)
  31. {
  32.  navRoot = document.getElementById("nav");
  33.  for (i=0; i<navRoot.childNodes.length; i++) 
  34.  {
  35.   node = navRoot.childNodes[i];
  36.   if (node.nodeName=="LI") 
  37.   {
  38.    node.onmouseover=function() 
  39.    {
  40.    this.className+=" over";
  41.    }
  42.    node.onmouseout=function() 
  43.    {
  44.     this.className=this.className.replace(" over", "");
  45.    }
  46.   }
  47.  }
  48. }
  49. }
  50. window.onload = startList;
  51. </script>
  52. </head>
  53. <body>
  54. <ul id="nav">
  55.   <li>Menu item 1
  56.     <ul>
  57.       <li><a href="#">menu item 1a</a></li>
  58.       <li><a href="#">menu item 1b</a></li>
  59.       <li><a href="#">menu item 1c</a></li>
  60.       <li><a href="#">menu item 1d</a></li>
  61.   </ul>
  62.  </li>
  63.   <li>Menu item 2
  64.     <ul>
  65.       <li><a href="#">menu item 2a</a></li>
  66.       <li><a href="#">menu item 2b</a></li>
  67.       <li><a href="#">menu item 2c</a></li>
  68.     </ul>
  69.   </li>
  70.   <li>Menu item 3
  71.     <ul>
  72.       <li><a href="#">menu item 3a</a></li>
  73.       <li><a href="#">menu item 3b</a></li>
  74.       <li><a href="#">menu item 3c</a></li>
  75.       <li><a href="#">menu item 3d</a></li>
  76.       <li><a href="#">menu item 3e</a></li>
  77.     </ul>
  78.   </li>
  79. </ul>
  80. </body>
  81. </html>
Offline Kevin - 10/02/2009 09:59
Avatar van Kevin Crew Ajax/REST
mothh schreef:
ik heb wel een nieuw soort gelijk menu voor je werkt ook perfect:
weet jij misschien hoe je een menu horizontaal krijgt in ie?


Probeer divkes naast mekaar? Of geef je li tags een breedte in je CSS?
Offline tbel - 10/02/2009 11:37
Avatar van tbel Nieuw lid Hoi mothh,

Bedankt, maar ik heb inderdaad een horizontaal menu nodig.
Alles werkt perfect, behalve in FF en Opera.

Iemand een oplossing?
Offline Kevin - 10/02/2009 13:10
Avatar van Kevin Crew Ajax/REST Heb het getest in Firefox en Safari. Ik zie toch geen fouten op je horizontaal menu?
Offline tbel - 10/02/2009 14:59
Avatar van tbel Nieuw lid Inmiddels heb ik bij Opera geen problemen meer.
Alleen bij FF beweegt het hele menu als ik over bepaalde knoppen ga.
Offline Kevin - 10/02/2009 15:34
Avatar van Kevin Crew Ajax/REST Nou, ik werk in firefox en ik merk er toch niets van.
Gebruik je een andere versie dan ik? (v2.0.0.14)
Offline tbel - 10/02/2009 16:22
Avatar van tbel Nieuw lid Ik heb FF nu geupgrade naar V3.0.6 en het werkt nu prima!
Het zal dus inderdaad daaraan gelegen hebben.

Bedankt!
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.193s