JS YouTube API Chromeless Player



我将如何将无铬YouTube播放器嵌入到我的网页中,YouTube api文档仅提供Javascript功能,您是使用iframe嵌入还是使用视频标签以及如何控制无铬播放器。

你可以按照文档调用javascript函数,

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

但要给它添加参数。 基本上,您在页面上创建一个具有特定ID的div

<div id=myplayer></div>

然后调用YouTube播放器

JavaScript
<script>
  var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('myplayer', {
      height: '390',
      width: '640',
      videoId: 'M7lc1UVf-VE'
      }
    });
  }

但这里有列表中的特定参数:https://developers.google.com/youtube/player_parameters

因此,我们将这些 playerVar 添加到函数中,将上面的函数替换为以下内容:

  function onYouTubeIframeAPIReady() {
    player = new YT.Player('myplayer', {
      height: '390',
      width: '640',
      videoId: 'M7lc1UVf-VE',
      playerVars: { 'controls': 0, 'showinfo': 0 }
    });
  }

然后,您将使用javascript停止/暂停/启动视频

player.playVideo()
player.pauseVideo()
player.stopVideo()

最基本的方法是为链接制作这些点击事件,例如

<a href='#' onclick='javascript:player.playVideo(); return true;'>Play</a> 

等。

相关内容

  • 没有找到相关文章

最新更新