首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Colorbox Youtube视频在移动设备上的自动播放

Colorbox Youtube视频在移动设备上的自动播放
EN

Stack Overflow用户
提问于 2015-05-03 19:32:25
回答 1查看 1.9K关注 0票数 0

我使用彩盒弹出一个youtube视频时,点击。因为我需要在点击时自动播放视频。我的代码在笔记本电脑上运行得很好。然而,它在智能手机上不起作用。Autoplay不是happening.It,需要点击视频才能播放。

我已经尝试了很多方法来强迫游戏。但是我不能成功。我在这里是如何尝试的是一个演示。

如果有任何解决这个问题的方法来强制播放移动设备,请您帮助我解决它。

提前感谢

代码语言:javascript
运行
复制
<link rel="stylesheet" href="colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.colorbox.js"></script>

<script>        
                var tag = document.createElement('script');
                tag.src = "//www.youtube.com/player_api";
                var firstScriptTag = document.getElementsByTagName('script')[0];
                firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);    

                var player;
                function onYouTubePlayerAPIReady() {
                  player = new YT.Player('player1', {
                    events: {
                      'onReady': onPlayerReady
                    }
                  });
                }

                function onPlayerReady(event) {


                          player.playVideo();     
                }   

        $("document").ready(function(){

         $("#content a[href*='youtube.com']").each(function() {
            var $this = $(this);
            var href = $this.attr('href');
            var youtubeId = href.split('/').pop();
            var link_id=$this.attr('id');
            $this.colorbox({ html: function() {
            var iframe = '<iframe id="player1" width="853" height="480" src="https://www.youtube.com/embed/' + youtubeId + '?enablejsapi=1&html5=1" frameborder="0" allowFullScreen></iframe>';
            var output = "<div style='line-height: 0px; overflow: hidden;'>" + iframe + '</div>';
            return output;
            },
            onComplete:function(){
            //  player.playVideo();
             }
            });
        });             
    });

</script>

<div id="content">
<p><a id="aaa" class='youtube' href="https://www.youtube.com/embed/FKWwdQu6_ok">To see video click here</a></p>
</div>
EN

回答 1

Stack Overflow用户

发布于 2017-09-04 18:35:27

您需要将此代码放在底部,因为在加载它时,它将调用api就绪函数。

代码语言:javascript
运行
复制
    var tag = document.createElement('script');
    tag.src = "//www.youtube.com/player_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);  
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30013335

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档