[Resolvido] Aparecer e sumir Div

[beatrizsena 1]

Olá,

Estou fazendo um mapa onde ao clicar num local do menu é dado um zoom numa área específica. Com a ajuda de algumas pessoas daqui, já consegui fazer com que todo o menu funcionasse com algumas poucas linhas de código. Mas além desse menu gostaria que também aparecesse uma div com informações referentes ao local onde o zoom é dado.

 

o zoom é dado através de:

 

HTML

<li><a class="link" href="#ead" name="infoEAD">EAD</a></li>
<li><a class="link" href="#reitoria" name="reitoria">Reitoria</a></li>

 

JS

$(document).ready(function() {
   $('a').click(function(evt) {
	$($(this).attr('href')).zoomTo({targetsize:0.45, duration:600});
       evt.stopPropagation();

Gostaria que além desse zoom houvesse uma chamada para as divs a seguir aparecerem nos respectivos lugares.

<div id="infoEAD" class="hidden" >
           <h4>infoEad</h4><h6>Retornar ao menu</h6>
       </div>

       <div id="reitoriaContent" class="hidden">
           <h4>Reitoria</h4><h6>Retornar ao menu</h6>
       </div>

Chamá-las por linhas de código específicas deixaria o código muito grande. Alguém sabe alguma maneira de fazer com que tudo funcione com pouco código ?

[beatrizsena 1]

Consegui fazer com que a Div suma e apareça , mas queria que isso funcionasse para todas elas.

 

JS:

$(document).ready(function(){

$('a').click(function(evt) {

$('#infoEAD').fadeIn('slow', function() {})

$('#infoEAD').click(function(evt){$('#infoEAD').fadeOut('slow', function() {});

 

});

});

})

[Lucas Guima 164]

Eu já não respondi essa dúvida em outro tópico? :huh:

[beatrizsena 1]

Eu já não respondi essa dúvida em outro tópico? :huh:

 

 

não , lá era outra coisa , parecida , mas não era a mesma coisa KKKK

[Lucas Guima 164]

Pelo que eu entendi, é sim.

 

Basta melhorar sua estrutura para facilitar a manipulação.

 

Por exemplo, as divs tem que ter um padrão de nome:

 

<div id="infoEad" class="hidden" >
   <h4>EAD</h4><h6>Retornar ao menu</h6>
</div>
<div id="infoReitoria" class="hidden">
   <h4>Reitoria</h4><h6>Retornar ao menu</h6>
</div>
<div id="infoLorem" class="hidden">
   <h4>Lorem</h4><h6>Retornar ao menu</h6>
</div>

E esse JS tá estranho. Apenas altere aquele que você já tem.

 

Para referenciar o conteúdo, você utilizou o atributo href direto. Agora você troca o # por info e chama a respectivas divs.

[beatrizsena 1]

Eu não posso alterar o href pois ele faz referência ao menu, onde ao clicar no botão "EAD" a div "InfoEAD" aparece.

[Lucas Guima 164]

Você resgata e altera apenas no evento.

[beatrizsena 1]

[RESOLVIDO]

 

Consegui ! Meu amigo me ajudou .

Mesmo assim obrigada Lucas.