0

Gostaria de saber como posso criar uma função em JS/Jquey que abre uma DIV que não esta visível.

Porem, vou ter mais de uma DIV, e preciso que o JS identifique essas DIV’s (espero ter sido claro) rs!!

Obs: Meu código é um slider e quando você clica em determinada imagem do slider ele vai abrir essa DIV com algumas informações.

3
  • Junta por favor à pergunta um exemplo do teu HTML.
    – Sergio
    24/03/2016 às 14:46
  • Eu não entendi muito bem.. tem uma imagem pequena e quando carrega entra uma imagem maior?
    – Fábio
    24/03/2016 às 14:57
  • Praticamente isso. Quando eu clicar na imagem do slide vai abrir uma DIV com width 100% e height 100% dentro dessa DIV temos essa mesma imagem que foi clicada, só que em um tamanho maior.
    – user36373
    24/03/2016 às 15:15

1 Resposta 1

0

Com Jquery ficaria algo parecido com isso:

1 - atribua uma classe e um atributo 'data' a imagem/slide que vai abrir a div e tambem o mesmo id na div que você gostaria de abrir com o click e faça o seguinte codigo:

<img class="classeImagem" src="caminho" data-alvo="idDaDivAberta01">
<div id="idDaDivAberta01">

2 - passe como parametro para a função o id da Div que quiser abrir.

$('.classeImagem').click(function(){
   var id = '#'+$(this).data('alvo');
   //mostrando a div
   toggleDiv(id);
   //se quiser fechar alguma que já esta aberta é só fazer verificador
});

//a função ficaria mais ou menos assim:

function toggleDiv(id){
    //verifica se o elemento já aberto não é o mesmo do clicado
    if($(id).hasClass('aberta') == false){
        $('.classeEmComum').fadeOut(700).removeClass('aberta');
        $(id).fadeIn(700).addClass('aberta');
    }
}

Espero ter ajudado, você pode atribuir o caracter '#' no valor do atributo data também, apesar de não ser uma boa prática. Lembre-se de adicionar uma classe em comum nas div's que vai manipular, e adicionar a classe no primeiro elemento que já virá aberto.

2
  • Na verdade acho que expliquei mal, vou dar outro exemplo. Tenho um função para abrir e fechar uma DIV <code> function abre() { $("#box").fadeIn(700); } function fechar() { $("#box").fadeOut(700); } </code> porem preciso abrir outras div's e não quero ficar repetindo function, gostaria de algo para resolver isso.
    – user36373
    24/03/2016 às 17:34
  • Editei a resposta, pelo que entendi da pergunta, dá uma olha e confira se é isso mesmo.
    – Nicolas
    24/03/2016 às 18:05

Você deve fazer log-in para responder a esta pergunta.