• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

passado

Problema com Drop-Down Horizontal

1 mensagem neste tópico

Boas sou muito muito novato em webdesign no entanto gostava de colocar um menu horizontal com drop-down, o menu todo funciona bem o unico problema e que em IE em qualquer versao os sub-menus nao aparecem, alguem me consegue ajudar?

/* menu horizontal by micox */
#menu-hh { 
display: table;
}
#menu-hh * { 
margin: 0; 
padding: 0;
}
#menu-hh a { 
display: block; 
}
#menu-hh li { 
list-style: none; 
float: left; 
height: 1%; }
#menu-hh li ul { 
position: absolute;
visibility: hidden;
white-space: nowrap;
}

/* hack para navegadores que exigem width para elementos pos absolute (Opera) */
html:first-child>body .menu-hh li ul { width: 500px; }
#menu-hh li:hover ul, .menu-hh  li.over ul { visibility: visible;} /* a class  .over eh tecnica pro hover no IE */
#menu-hh li:hover ul li ul, .menu-hh li.over ul li ul{ visibility: hidden;}
#menu-hh li ul li:hover ul, .menu-hh li ul li.over ul{ visibility: visible;}
/* visual */
#menu-hh {
background: transparent;
margin: 0 auto 0;
overflow: hidden;
width: 760px;
position: relative;
text-align: left;
font-family: Trebuchet MS,Tahoma, Verdana, Arial, Serif;
}
#menu-hh a { font-weight: bold; text-decoration: underline; color: #000/*cor do texto*/; padding: 0 10px; line-height: 20px;}
#menu-hh a:hover { text-decoration: underline; background-color: # 090;}
#menu-hh ul li ul { background-color: # F3F; border: 10px solid # 000; }	
  
/*end menu*/

function DOMgetElementsByClassName($node,$className){
       /* Description: retorna um array com todos os elementos dentro
          de $node que possuam a classe indicada em $className
       Versão: 1.0 - 30/08/2006
       Author: Micox - Náiron J.C.G - micoxjcg@yahoo.com.br
       Site:   http://elmicox.blogspot.com
       Não retire estas informações pra não infringir direitos autorais!
       */
    var $node, $atual, $className, $retorno = new Array(), $novos = new Array();
    $retorno = new Array();
    for (var $i=0;$i<$node.childNodes.length;$i++){
       $atual = $node.childNodes[$i];
       if($atual.nodeType==1){// 1 = XML_ELEMENT_NODE
          $classeAtual = $atual.className;
          if(new RegExp("\\b"+$className+"\\b").test($classeAtual)){
             $retorno[$retorno.length] = $atual;
          }
          if($atual.childNodes.length>0){
             $novos = DOMgetElementsByClassName($atual,$className);
             if($novos.length>0){
                $retorno = $retorno.concat($novos);
             }
          }
       }
    }
    return $retorno;
    }

    function addEvent(obj, evType, fn){
       //adiciona evento, versao crossbrowser
       //retirado de http://elcio.com.br/crossbrowser/#7
       if (obj.addEventListener){
          obj.addEventListener(evType, fn, true)}
       if (obj.attachEvent){
          obj.attachEvent("on"+evType, fn)}
       }
function ativaHover(classe) {
            //ativa o hover para elementos n?o links, por causa de bug do IE
            //retirado de http://www.maujor.com/tutorial/ddownmenu-a.php
            var pais = DOMgetElementsByClassName(document.body,classe);
            for (var j=0; j<pais.length; j++) {
                        var sfEls = pais[j].getElementsByTagName("LI");
                        for (var i=0; i<sfEls.length; i++) {
                                   sfEls[i].onmouseover=function() {
                                               this.className+=" over";
                                   }
                                   sfEls[i].onmouseout=function() {
                                               this.className=this.className.replace(new RegExp(" over\\b"), "");
                                   }
                        }
            }
}

addEvent(window,"load",function () { ativaHover("menu-hh"); });

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora