..:: MX Studio Fóruns ::..: Menu com Sub Menu IE6 - ..:: MX Studio Fóruns ::..

Jump to content

Publicidade




Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Menu com Sub Menu IE6 Javascript não funciona

#1 User is offline   NinoSPFC 

  • Group: Membros
  • Posts: 338
  • Joined: 21-September 05

Posted 06 August 2007 - 05:04 PM

Galera estou comum problema em um menu com sub menu em css.

No mozilla ele rola.. mais no ie6 ele não funciona...

Este menu eu peguei na net e queria adaptar da minha forma.. do jeito que estava abria os sub menus normalmente só que preciso que ele abra 2 de uma vez só no terceiro nivel...

Vá em Services e Hosting no mozilla funciona direitinho só que no ie nem ferrando...

CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">
<head>
<script type="text/javascript">
function IEHoverPseudo() {

    var navItems = document.getElementById("primary-nav").getElementsByTagName("li");
    
    for (var i=0; i<navItems.length; i++) {
        if(navItems[i].className == "menuparent") {
            navItems[i].onmouseover=function() { this.className += " over"; }
            navItems[i].onmouseout=function() { this.className = "menuparent"; }
        }
    }

}
window.onload = IEHoverPseudo;



</script>

<style type="text/css">

body {
    font: normal 11px verdana;
    }

ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 150px; /* Width of Menu Items */
    border-bottom: 1px solid #ccc;
    }

ul li {
    position:relative;
    }

ul li a {
    display: block;
    text-decoration: none;
    color: #777;
    background: #fff; /* IE6 Bug */
    padding: 5px;
    border: 1px solid #ccc;
    border-bottom: 0;
    }

/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */

ul li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */

ul ul {
    position:absolute;
    display:none;
    left: 149px; /* Set 1px less than menu width */
    top: 0;
}

li ul li a { padding: 2px 5px; } /* Sub Menu Styles */

li:hover ul ul, li.over ul ul { display:none; }

li:hover ul, li li:hover ul, li.over ul, li li.over ul { display: block; } /* The magic */

</style>
</head>
<body>
<ul id="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">About</a>

    <ul>
      <li><a href="#">History</a></li>

      <li><a href="#">Team</a></li>
      <li><a href="#">Offices</a></li>
    </ul>
  </li>
  <li><a href="#">Services</a>

    <ul>
      <li><a href="#">Web Design</a></li>

      <li><a href="#">Internet Marketing</a></li>
      <li><a href="#">Hosting</a>
          <ul>
              <li><a href="#">Dedicated</a></li>
            <ul>
              <li><a href="#">Virtual</a></li>
</ul>
          </ul>
      </li>
      <li><a href="#">Domain Names</a></li>
      <li><a href="#">Broadband</a></li>
    </ul>

  </li>

  <li><a href="#">Contact Us</a>
    <ul>
      <li><a href="#">United Kingdom</a></li>
      <li><a href="#">France</a></li>
      <li><a href="#">USA</a></li>
      <li><a href="#">Australia</a></li>

    </ul>
  </li>
</ul>
</body>
</html>



Quem puder me ajudar agradeço...
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic



Publicidade




1 User(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)