在播放 youtube iframe 嵌入时触发事件
我需要在播放 youtube iframe 时触发一个事件.因此,当按下播放按钮时,我需要调用一个函数来隐藏 span.module-strip
I need to fire an event on play of a youtube iframe. So when the play button is pressed I need to call a function to hide the span.module-strip
我已经尝试过了,但也许我走错了路?
I've tried this but maybe I'm going down the wrong path?
$("#home-latest-vid")[0].onplay = function() {
alert('hi');
};
HTML:
<div class="module module-home-video">
<span class="module-strip">Latest Product Video</span>
<iframe id="video" src="http://www.youtube.com/embed/RWeFOe2Cs4k?hd=1&rel=0&autohide=1&showinfo=0&enablejsapi=1" frameborder="0" width="640" height="360"></iframe>
</div>
推荐答案
- 演示:https://so.lucailosofi.com/fire-an-event-on-play-of-youtube-iframe-embed/
<script src="https://www.youtube.com/iframe_api"></script>
<div class="module module-home-video">
<span class="module-strip">Latest Product Video</span>
<div id="video"></div>
</div>
<script>
var player, playing = false;
function onYouTubeIframeAPIReady() {
player = new YT.Player('video', {
height: '360',
width: '640',
videoId: 'RWeFOe2Cs4k',
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
alert('video started');
playing = true;
}
else if(event.data == YT.PlayerState.PAUSED){
alert('video paused');
playing = false;
}
}
</script>
相关文章