Как остановить / приостановить воспроизведение видео, нажав кнопку «Закрыть»
Я пытаюсь использовать код jQuery, чтобы приостановить видео, нажав кнопку закрытия (X). Но это не работает. Пожалуйста, помогите мне с правильным кодом, как это сделать. У меня есть следующий код.
<div class = "popup__overlay">
<div id = "popupVid" class = "popup">
<a class = "close">X</a>
<br />
<video id = "framevideo" controls = "controls" width = "500">
<source src = "https://eocares.com/wp-content/uploads/2018/12/Website-version1.mp4" type = "video/mp4" />
<br />
</video>
</div>
</div>
код jQuery:
jQuery(".close").click(function() {
jQuery('video')[0].pause();
});
Ваш код работает нормально для паузы. Вы хотите чего-нибудь еще?
Ваш код работает нормально.
я не знаю, почему он не работает с моей стороны
Ваш код работает нормально. проверить ошибку и включить библиотеку jquery перед скриптом
Я обновил ваш код. Но все же вы должны проверять наличие ошибок на вашей стороне.
Я проверил, что ваш код у меня работает нормально. у вас есть ошибка на консоли?
запомните ваш $ (document) .ready (function () {// code})
вы видите ошибку в консоли?
Ответы 2
Если вы хотите воспроизвести и приостановить видео, нажав, вот простой код:
$(document).ready(function() {
var click = 0;
$('video')[0].play();
$(".close").click(function() {
if ( parseInt(click) % 2 == 0 ) {
$('video')[0].pause();
} else {
$('video')[0].play();
}
click++;
});
});
Надеюсь это поможет.
Ваш код уже готов, пожалуйста, проверьте, правильно ли вы позвонили в ваш код. Я обновил вам тот же код, но применил некоторый стиль CSS и вызвал файл библиотеки JQuery.
$(".close").click(function() {
$('video')[0].pause();
});.popup__overlay{
width: 600px;
position: relative;
margin: 0 auto;
}
.popup__overlay video{width:100%;}
.close{
position: absolute;
top: 30px;
right: 30px;
z-index: 10;
background: #e2dddd;
width: 30px;
height: 30px;
border-radius: 50%;
text-align: center;
padding: 7px 1px 0px;
}<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class = "popup__overlay">
<div id = "popupVid" class = "popup">
<a class = "close">X</a>
<br />
<video id = "framevideo" controls = "controls" width = "500">
<source src = "https://eocares.com/wp-content/uploads/2018/12/Website-version1.mp4" type = "video/mp4" />
<br />
</video>
</div>
</div>
Для воспроизведения используйте
$('#framevideo')[0].play();и для паузы$('#framevideo')[0].pause();