Подскажите почему не срабатывает toggleClass при нажатии на абсолютно позиционируемый элемент поверх изображения.
<section class="content">
<div class="container">
<div class="concert_hall">
<div class="concert_hall-img">
<img src="../img/concert/36.png" alt="" />
<a href="#">
<div class="concert_popup-left"></div>
</a>
<a href="#">
<div class="concert_popup-rigth"></div>
</a>
</div>
</div>
<div class="concert_hall-modulle">
<img src="../img/kopia.jpg" alt="" />
</div>
</div>
</section>
/*Concert hall*/
.concert_hall-img img{
max-width: 100%;
}
.concert_hall-img{
position: relative;
}
.concert_popup {
}
.concert_popup-left {
position: absolute;
background-color: transparent;
width: 35%;
height: 30%;
bottom: 4%;
left: 7%;
}
.concert_popup-rigth {
position: absolute;
background-color: transparent;
width: 44.3%;
height: 30%;
bottom: 4%;
right: 6%;
}
/*Модальное окно*/
.concert_hall-modulle {
max-width: 100%;
visibility: hidden;
opacity: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.concert_hall-modulle.active_modulle{
visibility: visible;
opacity: 1;
}
$(document).ready(function(){
$(".headd_burger").click(function(event){
$('.headd_burger, .headd-menu').toggleClass('active');
$('body').toggleClass('lock');
})
$(".concert_popup-left").click(function(event){
$('.concert_hall-modul').toggleClass('active_modulle');
});
});
