2

使用他们的 API 为嵌入的 YouTube 视频创建自定义播放按钮很容易,但是该按钮似乎无法在移动环境中启动视频,尤其是 Android。当您在此处单击它时,屏幕将永远变黑,并带有旋转的加载动画。

<div id="wrapper">
    <div id="video">

    </div>
    <a href="javascript:;" id="play">Play</a>
</div>


<script>
var player, tag = document.createElement('script');

tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

window.onYouTubeIframeAPIReady = function() {
    player = new YT.Player('video', {
        height: '320',
        width: '240',
        videoId: '5oxIQe3XngY',
        playerVars: {
            modestbranding: 1,
            controls: 0,
            rel: 0

        }
    });

    player.addEventListener('onReady', function(e) {
        document.getElementById('play').onclick = function() {
            player.playVideo();
        };
    });

    player.addEventListener('onStateChange', function(e) {
        if (e.data == 1) { 
            document.getElementById('play').style.display = 'none';
        }
    });
};
</script>

这是小提琴:http: //jsfiddle.net/HArsN/

有什么解决办法吗?是否必须仅通过捆绑按钮启动视频?

4

0 回答 0