Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá novamente pessoal :)
Estou no meu projeto.. sempre.. e gostaria de saber como se faz o menu desse site:
http://www.avchap.com.br/index.php
Eu abri o código fonte, mas não entendi muita coisa.. Poderiam me ajudar ?
Grata ^_^
Hm... mas e o botão ali ? qdo clica ele abre o sub-menu.. não entendi como faz isso O.o
AAh, é em JQuery :/
Não sei nada sobre isso.. eu coloco o código do JQuery no HTML, em baixo de <body> ?
E tem classes no css nesse menu ?
Grata.
Ah, e poderiam me indicar algum tutorial ?
aprendiz tu pode me ajudar a fazer um menu tipo o da pagina inicial do ig aquele do topo????
Abçs
>
AAh, é em JQuery :/
só mais uma pergunta, eu coloco o código do JQuery no HTML, em baixo de <body> ?
Grata.
Adiciona os scripts dentro da seção head utilizando
$(document).ready(function(){
// aqui entra o codigo do menu
});>
aprendiz tu pode me ajudar a fazer um menu tipo o da pagina inicial do ig aquele do topo????
Abçs
Pega aquela estrutura inicial que postei adiciona um width para a tag A e coloca um float: left
se não conseguir, posta ai o seu código do menu
hm, eu teria que colocar antes alguma tag do tipo
<head>
<script language="JavaScript"></script>
</head> ?>
>
AAh, é em JQuery :/
só mais uma pergunta, eu coloco o código do JQuery no HTML, em baixo de <body> ?
Grata.
Adiciona os scripts dentro da seção head utilizando
$(document).ready(function(){
// aqui entra o codigo do menu
});>
aprendiz tu pode me ajudar a fazer um menu tipo o da pagina inicial do ig aquele do topo????
Abçs
Pega aquela estrutura inicial que postei adiciona um width para a tag A e coloca um float: left
se não conseguir, posta ai o seu código do menu
mais para ficar na horizontal????
Meh,
se for pra fazer assim, igual o do site, um JavaScript, alternando entre display: block e display: none.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
>
hm, eu teria que colocar antes alguma tag do tipo
<head>
<script language="JavaScript"></script>
</head> ? isso mesmo
>
Meh,
se for pra fazer assim, igual o do site, um JavaScript, alternando entre display: block e display: none.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Assim dá também Thiago, o desenvolvedor teria mais trabalho, pois teria que esconder todos os menus e exibir apenas o clicado, usando o plugin, fica muito mais fácil
Ah.. JQuery não é minha praia.. mas vou tentar! qualquer coisa, tento outras táticas.. espero que dê certo :)
Vocês podem me recomendar um tutorial ? Preferencialmente em português, pq não manjo inglês, e os tradutores muito menos :x
Grata.
>
>
Meh,
se for pra fazer assim, igual o do site, um JavaScript, alternando entre display: block e display: none.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Assim dá também Thiago, o desenvolvedor teria mais trabalho, pois teria que esconder todos os menus e exibir apenas o clicado, usando o plugin, fica muito mais fácil
Sim. Mas as vezes acho que a pessoa entra no comodismo e se limita a aprender, entende?
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
>
Thiago Retondar, em 12 fevereiro 2010 - 15:10 , disse:
Meh,
se for pra fazer assim, igual o do site, um Javascript, alternando entre display: block e display: none.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Não entendi o que você quis dizer..
Assim:
quando clicar no botão, você percorre todos eles com um loop verificando se estão abertos. Se estiver, feche-o. Após isso abra o que foi clicado.
Understand?
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Não ._.
Me sinto sem inteligência http://forum.imasters.com.br/public/style_emoticons/default/ermm.gif
tenho mais uma pergunta.. é em CSS essa técnica q você está repassando? tks..
se esconde
:S
Não. Isso é JavaScript.
Estou sem tempo agora, mas quando eu tiver, eu te mando um exemplo simples de fazer. ;D
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
No link que mandei tem um exemplo usando o jQuery
basta copiar e colar
Assim dá também Thiago, o desenvolvedor teria mais trabalho, pois teria que esconder todos os menus e exibir apenas o clicado, usando o plugin, fica muito mais fácil
faço com 7 linhas:
html
<ul id="menu">
<li><span>lanches</span>
<ul>
<li><a href="#">X-Salada</a></li>
<li><a href="#">X-Egg</a></li>
<li><a href="#">X-Burger</a></li>
<li><a href="#">X-Tudo</a></li>
</ul>
</li>
<li><span>pizzas</span>
<ul>
<li><a href="#">Mozarella</a></li>
<li><a href="#">Calabresa</a></li>
<li><a href="#">4-Queios</a></li>
<li><a href="#">Portuguesa</a></li>
</ul>
</li>
<li><span>massas</span>
<ul>
<li><a href="#">Spagetti</a></li>
<li><a href="#">Gnocci</a></li>
<li><a href="#">Lasagna</a></li>
</ul>
</li>
</ul>css
* { margin: 0; padding: 0}
li { list-style: none; }
#menu ul { display: none }
js
window.onload = function(){
spans = document.getElementById('menu').getElementsByTagName('span');
submenus = document.getElementById('menu').getElementsByTagName('ul');
for(i = 0; i < spans.lenght; i++) spans.item(i).onclick = function(){
for(j = 0; j < submenus.lenght; j++) submenus.item(i).style.display = 'none';
this.parentNode.getElementsByTagName('ul').item(0).style.display = 'block';
}
}Ufs.. voltei!
Beleza.. pode mandar thiago.. Obrigada.
Vou testar de tudo aqui, qualquer coisa chamo. Obrigada pela ajuda de todos vocês :)
http://forum.imasters.com.br/public/style_emoticons/default/joia.gif
O Evandro já mostrou como fazer. ;)
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Se quiser fazer com JQuery de uma olhada aqui:
http://api.jquery.com/slideToggle/
é tranquilo e facil de compreender.
Uh! Muito obrigada Alexandre! Eu estou começando a aprender JQuery.. tá meio dificil com as apostilas que achei na web, mas vou seguindo.. vou tentar me superiorizar com os tradutores
URAHRIUHRIUAHIURHA
De qualquer forma, não deu muito certo o código que o Evandro passou.. acho que coloquei errado, seilá.. talvez eu entenda mais tarde o porquê disso...
Muito obrigada, em breve volto com o que aprendi..
No site do maujor também tem esse mesmo menu.. não sei o que realmente fazer ... Enquanto não acho um tutorial que me ensine desde o inicio, vo nas apostila >.<
De qualquer forma (2), um dia eu aprendo :)
Um monte de gente já respondeu e tal...
mas vou dar um sugestão....
http://elmicox.blogspot.com/2007/04/accordion-menu.html
Da para modificar ele de várias formas...
eu utilizei em dois sites que fiz
www.selex.com.br
www.metalurgicausion.com.br
Se precisar de uma força para mexer nele é só dar um toque...
Se quiser aprender JQuery eu recomendo o livro do Maujor
eu comprei e recomendo
Beleza, Obrigado. De agora em diante eu me viro. Acho que vcs me ajudaram demais nesse tópico. Obrigada mesmo http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Topc resolvido, pelo menos pra mim. :P
a estrutura dele é assim
ul li a {
ul li a:hover {
abraço