自动播放youtube视频(使用youtube api)
自动播放youtube视频(使用youtube api)
提问于 2014-11-20 12:14:45
当视频在屏幕上(滚动到)时，有什么方法可以让youtube视频自动播放吗？
我的网站上有这样一个部分：
<!-- Home -->
<section id="home" class="container relative pattern-black">
<!-- Ful Screen Home -->
<div id="fullscreen" class="fullscreen pattern-black soft-bg-1 z-1">
<!-- Video -->
<div id="P2" class="player video-container" data-property="{videoURL:'gpSSGCf9nHY',containment:'#fullscreen',autoPlay:true, showControls:true, mute:false, startAt:0, opacity:0.2}"></div>
<!-- End Video -->
</div>
<!-- End Ful Screen Home -->
<!-- Home Elements v2 -->
<div class="home-elements">
<!-- Home Inner -->
<div class="home-inner v2 t-center">
<!-- Home Text Slider -->
<div class="home-text-slider relative">
<div class="text-slider clearfix">
<!-- Home Text Slides -->
<ul class="home-texts clearfix t-center semibold">
<li class="slide white uppercase">we are create awesome themes!</li>
<li class="slide white uppercase">We are creative designers</li>
<li class="slide white uppercase">we love to designing</li>
</ul>
<!-- End Home Text Slides -->
<!-- Home Fixed Text -->
<h1 class="home-fixed-text t-center">Welcome to <span class="gray-tone">North!</span> We love to design. We are happy with <span class="gray-tone">you are !</span></h1>
</div>
</div>
<!-- End Home Text Slider -->
<!-- Home Button -->
<a href="#" target="_blank" class="home-button-1 uppercase oswald semibold gray">
purchase
</a>
<!-- Home Button -->
<a href="#about" class="scroll home-button-1 uppercase oswald semibold gray">
read more
</a>
</div><!-- End Home Inner -->
</div><!-- End Home Elements -->
</section><!-- End Home Section -->这是用于视频(jquery.mb.YTPlayer.js)的代码：
http://jsfiddle.net/55omdr0o/
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-11-24 08:33:34
我找到了一个办法。
当用户滚动到元素时，可以使用jQuery方法点插件来检测。
带有该视频的div具有id 'P2'，因此我将此代码添加到我的页面中，并使用该视频：
<script>
// Use waypoints.min.js to detect if the user is at div with id P2
$(function() {
$('#P2').waypoint(function() {
$('#P2').playYTP();
});
});
</script>你可以在这里找到路标：https://github.com/imakewebthings/jquery-waypoints
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/27039360
复制相关文章
相似问题
腾讯云开发者
