Есть код который по клику немного увеличивает блок с видео, и включает на нём звук, есть кнопка X что бы немного свернуть его и выключить. При клике на X ничего не выполняется кроме обычного alert. Что нужно исправить что бы заработало. В консоли ошибок нет.(
zvuk-off.ru/testsite тут можете посмотреть на сайте, небольшое окно слева внизу)
<div class="widget-preview">
<video autoplay muted loop id="myVideo">
<source src="images/vid-widget.mp4" type="video/mp4">
</video>
<span class="close-widget" >X</span>
</div>
.widget-preview{
display: block;
position: fixed;
left: 20px;
bottom: 25px;
border: 2px solid #1064b4;
z-index: 99999;
width: 180px;
height: 270px;
border-radius: 15px;
overflow: hidden;
transition: 0.5s;
}
.widget-preview:hover{
cursor: pointer;
}
.close-widget{
display: none;
position: absolute;
top: 0;
right: 0;
padding: 10px;
font-size: 20px;
border: 2px solid rgba(77,77,77,.8);
border-radius: 0 15px 0;
z-index: 999999;
}
.widget-preview video{
position: absolute;
left: -45%;
top: -45%;
}
.active-widget{
width: 360px !important;
height: 540px !important;
cursor: default;
transition: 0.5s;
}
@media (max-width: 905px) {
.widget-preview{
display: none !important;
}
}
$('.widget-preview').on('click',function(){
$(this).addClass('active-widget');
$('#myVideo').css('position','initial');
$('#myVideo').css('width','100%');
$('.close-widget').css('display','block');
$("video").prop('muted', false);
});
$('.close-widget').on('click',function(){
/*
*/
alert('hello');
$('.close-widget').css('display','none');
$('.widget-preview').removeClass('active-widget');
$('#myVideo').css('position','absolute');
$('#myVideo').css('width','auto');
$("video").prop('muted', true);
});
Простой
