Question

问题：

拜托，有人可以准确地解释一下，如何在我的页面中嵌入一个简单的Chromeless Youtube播放器，并动态控制该播放器的来源吗？

问题解释： 我正在使用一个页面，我需要嵌入一个没有控件的YouTube视频。经过一些研究，我发现Chromeless视频播放器就是这样。但这是我的问题：

我在Chromeless播放器上发现很少甚至没有教程内容，并且对Javascript来说相对较新，我无法理解所提供的文档here，我可以将它应用到我的问题。
我需要根据用户互动更改此视频的来源。我最初还没有对youtube javascript API感到满意，只是通过静态iframe嵌入视频，并通过JQuery使用.attr（“src”，nameofsource）更改iframe的来源，而不是使用javascript加载嵌入，只更改消息来源。

运行正常，我能够通过youtube接受附加到嵌入网址的参数隐藏大部分控件，但绝对没有办法用该方法静音视频，代码很简单，并且我对它不满意。

所以我开始嵌入视频并通过API更改源代码，效果很好，视频静音，并且更改源代码很好，但现在我遇到了控制器出现的问题。

根据我在Chromeless播放器上看到的文档，我没有看到只是在javascript YT API中添加参数，而是完全不同的东西。

问题重申：

那么，有人可以准确地解释一下，如何在我的页面中嵌入一个简单的Chromeless Youtube播放器，并动态控制该播放器的来源吗？

我没有在互联网上找到的文档提供了一个令人满意的，全面的（对新的javascript开发人员友好）解释如何执行此操作。作为一名新开发人员，我已经查看了文档，但我还没有足够的经验来有效地“使用本手册”。

我在StackOverflow上发现了一些关于无边框播放器的问题，但是没有一个问题能得到令人满意的答案。

已知文档：

https://developers.google.com/youtube/flash_api_reference

https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player

http://viget.com/inspire/youtube-chromeless-video-jquery-plugin

已知相关StackOverflow问题答案不充分：

[23K views，Inadequate Answer]： How do I go about embedding a youtube chromeless player without adding controls?

[1.4K观点，答案不足]： How to make a YouTube chromeless player?

Answer 1

在您的HTML中，您需要：

<script src="https://www.youtube.com/iframe_api"></script>
<div id="player"></div>

然后在你的JavaScript中

var player;
function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        videoId: 'OJpQgSZ49tk',
        playerVars: {
            controls: 0,
            autoplay: 1,
            disablekb: 1,
            enablejsapi: 1,
            iv_load_policy: 3,
            modestbranding: 1,
            showinfo: 0
        }
    });
}

完成加载后，YouTube的API会调用onYouTubeIframeAPIReady功能。其他参数和其他示例可在文档中找到：https://developers.google.com/youtube/iframe_api_reference

Answer 2

Youtube不会让你摆脱一切，但你可以尝试http://mediaelementjs.com/ - 这可以让你控制控件的显示，并在你想要的时候隐藏它们。

简单的无铬Youtube嵌入 - 怎么样？

2 个答案: