我试图通过点击视频或通过按钮来切换背景视频的暂停/播放。 我设法让视频点击触发器工作,但无法弄清楚如何处理按钮部分。我学习jquery所以还是有点新手!
这是我到目前为止所得到的:
$("video").trigger("play");//for auto play
$("video").addClass('pause');//for check pause or play add a class
$('video').click(function() {
if ($(this).hasClass('pause')) {
$("video").trigger("play");
$(this).removeClass('pause');
$("#artwork").removeClass('fadein')
$(this).addClass('play');
pauseButton.innerHTML = "Pause";
} else {
$("video").trigger("pause");
$(this).removeClass('play');
$(this).addClass('pause');
$("#artwork").addClass('fadein');
pauseButton.innerHTML = "Paused";
}
});
任何帮助表示赞赏! 干杯
答案 0 :(得分:1)
据我了解,即使在视频上你已经处理了点击,它也能正常工作。所以只需对你的pauseButton做同样的事情。将与点击相关的代码移动到某个功能,并将其绑定为您想要的任何触发器的回调 - 单击视频,单击按钮等。因此,最低限度地更新您的代码:
function toggleVideo() {
if ($(this).hasClass('pause')) {
$("video").trigger("play");
$(this).removeClass('pause');
$("#artwork").removeClass('fadein')
$(this).addClass('play');
pauseButton.innerHTML = "Pause";
} else {
$("video").trigger("pause");
$(this).removeClass('play');
$(this).addClass('pause');
$("#artwork").addClass('fadein');
pauseButton.innerHTML = "Paused";
}
};
$('video').click(toggleVideo); // handle click on video
// assuming pauseButton references your play/pause button
$(pauseButton).click(toggleVideo); // handle click on button
$("video").trigger("play"); // for auto play
$("video").addClass('pause'); // for check pause or play add a class