如何在向下滚动时停止自动播放
How Stop Auto Play While Scroll Down
我在标题中添加了自动播放的视频,但当用户向下滚动到页面时,我无法停止视频。。
试试这个。
您的浏览器不支持视频标记。我建议你升级浏览器。
为此,您必须使用Google youtube API。
// 2. This code loads the IFrame Player API code asynchronously.
// Youtuber API
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '315',
width: '560',
playerVars : {
autoplay : 0,
controls: 0,
disablekb:0,
modestbranding:1,
showinfo:0
},
videoId: '3MGrgzTGdtE',
events: {
'onReady': onPlayerReady,
//'onStateChange': onPlayerStateChange
}
});
player2 = new YT.Player('player2', {
height: '315',
width: '560',
playerVars : {
autoplay : 0
},
videoId: '3MGrgzTGdtE',
events: {
//'onReady': onPlayerReady2,
//'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.mute();
//event.target.playVideo();
}
function stopVideo() {
player.stopVideo();
}
$(window).scroll(function() {
var topOfOthnxtDiv = $("#parelaxhome").offset().top;
$("#medicinediv").each( function() {
if( ($(window).scrollTop() > $(this).offset().top) ) {
// $(this).css('opacity',1);
player.playVideo();
} if($(window).scrollTop() >= topOfOthnxtDiv) {
//$(this).css('opacity',0);
player.stopVideo();
}
});
});
$(document).ready(function(e) {
$('.pclose').click(function(){
player2.stopVideo();
})
$('.clickpop').click(function(){
player2.playVideo();
player2.seekTo(0);
player2.unMute();
})
});
<div class="videodiv">
<div id="myframe">
<div id="play-video"></div>
<div id="player"></div>
</div>
相关文章:
- 我可以使此幻灯片图像自动播放吗?
- 如何使jquery自动播放
- 在移动设备中自动播放视频
- 需要帮助自定义幻灯片自动播放
- 在iframe中阻止网站中的vimeo自动播放
- 使用addevent时,VideoJs的自动播放未被触发
- 为简单的jQuery滑块添加自动播放功能
- 使用jQuery加载页面时自动向上滚动
- 自动上下滚动元素
- iframe src 使用现有值在单击时添加自动播放=true 参数
- 如何降低html视频的自动播放音量
- 如何在向下滚动时停止自动播放
- 自动播放youtube视频的Javascript
- 10秒后停止自动播放-环岛
- 如何在HTML5画布上自动播放短视频剪辑
- 在按钮上单击暂停HTML视频(正在自动播放)
- 检测iOS移动设备的JavaScript比自动播放音频
- 能够在jQuery插件中的滚动位置自动播放
- HTML文档类型导致视频自动播放而不滚动到
- 滚动到时自动播放Youtube视频