Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Andre Cristhian

Abrir um e fechar o outro

Recommended Posts

Gente tenho esse código por favor me deêm um help aqui...

 

<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.abrir-home').click(function(e) {
       $('.home').slideToggle('slow')
   });
});



$(document).ready(function() {
$('.abrir-empresa').click(function(e) {
       $('.empresa').slideToggle('slow')
   });
});
</script>



<style type="text/css">
*{margin:0;padding:0;list-style:none;font: 13px Arial, Helvetica, sans-serif}
.home {width:100%;height:100px;background: #0C3;box-shadow: 0 0 10px #999;display:none}
.abrir-home {width:100px;padding:5px;background:#999999;border-radius: 0 0 5px 5px;text-align:center}
.abrir-home a {color:#FFFFFF;text-decoration:none}
.abrir-home a:hover {color:#F1f1f1;text-decoration:none}


.empresa {width:100%;height:100px;background: #0C3;box-shadow: 0 0 10px #999;display:none}
.abrir-empresa {width:100px;padding:5px;background:#999999;border-radius: 0 0 5px 5px;text-align:center}
.abrir-empresa a {color:#FFFFFF;text-decoration:none}
.abrir-empresa a:hover {color:#F1f1f1;text-decoration:none}
</style>



<div class="home"></div>
<div class="abrir-home"><a href="#" onClick="return false">HOME</a></div> 


<div class="empresa"></div>
<div class="abrir-empresa"><a href="#" onClick="return false">EMPRESA</a></div> 

 

 

minha dúvida é o seguinte, eu gostaria que quando eu clicasse em um menu ele abrisse normal, até ai de boa mais alem disso apenas queria que quando eu clicasse no outro menu ele fechasse o atual e abrisse o que eu cliquei... teria como fazer isso ?

 

Obrigado pela atenção!

Compartilhar este post


Link para o post
Compartilhar em outros sites

sim, tem como sim. Vê se isso resolve:

<script type="text/javascript">
       $('.home').hide();    // isso seria o correto para acontecer
       $('.empresa').hide(); // isso seria o correto para acontecer
       $('.abrir-home').click(function(e) {
       $('.home').slideToggle('slow')
       $('.empresa').slideUp('slow')
   });
});



$(document).ready(function() {
       $('.abrir-empresa').click(function(e) {
       $('.empresa').slideToggle('slow')
       $('.home').slideUp('slow')
   });
});
</script>

Tem uma coisa, para isso acontecer, as classes que estao com efeito para aparecer tem que estar escondidas. Então o código certo seria elas estarem hide de inicio.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.