Open different elements js

Question

I would like to know how I can create a function in JS/Jquey which opens a DIV which nay this visible.

However, I will have more than one DIV, and I need the JS to identify these DIV’s (I hope I was clear) rs!!

Obs: My code is a slider and when you click on certain image of the slider it will open that DIV with some information.

Answer 1

With Jquery would look something like this:

1 - assign a class and a date attribute to the image/slide that will open the div and also the same id in the div that you would like to open with the click and make the following code:

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

2 - pass the Div id you want to open as a parameter.

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

//the function would look something like this:

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');
    }
}

I hope I helped, you can assign the character '#' in the value of the date attribute as well, although it is not a good practice. Remember to add a common class in div’s that will handle, and add the class in the first element that will already be opened.