Stack Overflow的成员亲切地创建了一个工作脚本,在Youtube视频完成时显示隐藏的div。在这里查看它非常酷。 :invalid
。我如何将以下代码放在头部,以便我可以创建一个在WordPress中引用此JavaScript的简短代码?目前,它的设置在页面正文中运行。 WordPress不喜欢这样工作。
最终游戏是查看嵌入式YouTube视频,然后视频完成后会显示隐藏的div。我不相信我正确地接近这一点。如果您认为有更好的方法,我会向您表示赞同。
以下是代码
<div id="player"></div>
<script src="http://www.youtube.com/player_api"></script>
<script>
// create youtube player
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: '0Bmhjf0rKe8',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// autoplay video
function onPlayerReady(event) {
event.target.playVideo();
}
// when video ends
function onPlayerStateChange(event) {
if(event.data === 0) {
$('html, body').animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
}
}
</script>
<div id='elementtoScrollToID' class='my_div'> Hello! </div>