[Resolvido] Efeito em menu

[Giovani 104]

Boa tarde amigos, estou precisando de um help, uma indicação pra fazer o seguinte:

 

1) Tenho um topo com marca, banner (usando o jquery cycle) e tenho uma "menu". Serão duas opções com um efeito. A seguir o topo sem o efeito:

 

E agora com o efeito (só abre o efeito no item em que o mouse passar/estiver):

 

Como não manjo de javascript, não sei nem por onde começar.

 

Agradeço ajuda :)

[William Bruno 1501]

hum...

 

acho que nem precisa de js...

<ul>

<li>Titulo 01

<ul>

<li>Subtitulo 01</li>

<li>Subtitulo 02</li>

</ul>

</li>

 

ai você aplica a imagem de cima, com a borda arredondada no primeiro li

 

e a parte de baixo, no ul, posicionada com background-position: bottom;

 

só vai usar js mesmo, se quiser algum efeito... a marcação terá que ser HTML, e as imagens css..

ou a dúvida é outra coisa ?

[Giovani 104]

William, o css eu imaginei basicamente o mesmo que você, mas o efeito não ter que ser em js?

Pra quando o cara passar o mouse sobre o menu abrir o menu abaixo? Vai funcionar sem js nos IEs esse efeito??

[William Bruno 1501]

então.. primeiro agente faz a regra, e depois arruma a excessão ne?! ^_^

 

tipo.. o único problema do ie, é o :hover, ai você joga um js basico.. tipo os que eu coloco para os dropdowns do desafio

window.onload = function() {
if (document.all&&document.getElementById) {
        navRoot = document.getElementById("menu");
                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", "");
   }
   }
  }
 }
}

http://forum.imasters.com.br/index.php?/topic/354140-repente-css-menus/page__view__findpost__p__1345241

 

 

esse ainda é o js que o Maujor sugeriu em alguns menus dele:

http://maujor.com/tutorial/ddownmenu.php

 

ai, você só aplica uma class .over e tudo funciona.

se você quiser um efeito legal, do menu abrir aos poucos, ai podemos usar js de verdade ^_^

 

 

esse teu menu, é interessante.. num tá afim de lançar de desafio lá não ?

só formatar ele, pra ficar mais ou menos que nem os outros.. mesmos itens e tal..

[Giovani 104]

Adoraria lançar esse desafio, mas tenho até segunda pra entregar um job (que tem esse menu).

A ideia seria, sim, fazer o menu abrir aos poucos :)

[William Bruno 1501]

^_^ resolvi com css puro aqui..

 

o efeito você conseguiu fazer 'pro ff', só com HTML e CSS ?

[Giovani 104]

To trabalhando em outra coisa nesse momento, mas quero ver isso ainda hoje.

Ai falo contigo por aqui ou msn :)

[Giovani 104]

Opa, não posso deixar de agradecer o amigo William :D

Problema resolvido!

 

Só não posto aqui o resultado a ajuda por que tem o Repente CSS - Menu