[Resolvido] detalhe com hover e IE6 em menu dropdown.

[Jair Humberto 2]

Olá pessoal,

 

Eu estou tentando criar um efeito parecido com o menu dropdown em um elemento bloco na página. Há muito tempo vi um exemplo de menu drop down no site do micox (eu acho), e como eu não tenho, aqui onde trabalho, acesso 100% liberado à internet, mas somente a sites específicos, tentei lembrar do que eu tinha visto nessa matéria e ficou assim:

 

<!-- só a parte que interessa mesmo -->
<div class="externa">
    <a href="javascript:void(0)">passar o mouse neste link</a><!-- nem precisava ser link -->
    <div class="drop">Texto e links devem aparecer aqui</div>
</div>

/* CSS */

.drop {
    width: 187px;
    height: 60px;
    background: #eee;
    display: none;
}

.externa:hover div.drop {
    display: block;
}

No caso da matéria que citei, era mais fácil pois era com elementos ULs; no meu caso UL ficaria esquisito e acho que nem seria certo, assim, o problema é que o IE6 só aceita hover em links, mas eu tenho o hover em div! Parece que eu tinha visto uma solução em algum lugar parecida com isto:

 

.externa:hover div.drop,
.externa.hover div.drop {
    display: block;
}

E a partir daí simular isto: <div class="externa hover"> através de um comando no IE6, pra CSS, do qual não conheço nada, acho que é expression.

 

Alguém sabe como faz isso?

 

Gente, não tenho acesso liberado à internet, então se postarem links não me ajudará muito, pois não poderei ler. http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

 

desde já agradeço.

[Thiago Retondar 18]

Tente esse JavaScript:

 

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace
	(" over", "");
   }
   }
  }
 }
}
window.onload=startList[b][/b]

Acho que você já sabe fazer as modificações. ^_^

[Jair Humberto 2]

ah legal. Obrigado.

então, expression não passa de javascript ein?

 

bom saber. ^_^

[William Bruno 1501]

Na verdade não.

A expression que você deve estar se referindo, é um código proprietário da Microsoft, escrito em sei lá que linguagem

 

O código que o Thiago postou é Javascript puro, e resolve até melhor do que se você usar expression.

[Jair Humberto 2]

Olá William,

 

Isto que você falou não parece estar correto,

porque joguei o código que o Thiago postou, que é Javascript, dentro

de expression e funcionou perfeitamente.

 

Na verdade modifiquei ele para torná-lo mais simples, pois algumas coisas parecem ser desnecessárias.

 

Bem pode ser que a propriedade expression seja proprietária da Microsoft porque só funciona no Internet Explorer e não é CSS válido; mas optei por esse caminho, porque parece ser a única forma de resolver esse problema no Internet Explorer 6.

 

Se existe alguma linguagem específica da Microsoft para usar dentro de expression, isso não sei, mas sei que posso usar javascript, pois fiz os testes. Pesquisei outros exemplos na Internet e não achei nada que fosse

diferente de javascript em expression ainda.

 

mar ta valendo, o importante é que o problema foi resolvido

 

:mellow:

[William Bruno 1501]

^^ tranquilo, importante é que resolveu.

Tanto com expression, como com Javascript era possível resolver.

 

Ainda existe a possibilidade de usar arquivos .htc que são javascript.

Mas dá uma olhada no que é uma expression mesmo:

http://www.visibilityinherit.com/code/ie6-hover-expression.php

 

Enfim, um código bem estranho, colocado dentro do css... javascript mesmo, não admite esse tipo de sintaxe..

.iehover { /* IE6 hover */
	m: expression(this.onmouseover =  new Function("this.className = 'iehover-hover';"));
}
.iehover:hover, .iehover-hover { /* IE6 hover */
	background: #999;
	m: expression(this.onmouseout = new Function("this.className = 'iehover';"));
}

oque você deve ter feito é um Comentário Condicional. Não confunda as nomeclaturas http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif