YouTube iframe api正在用错误的大小调整我嵌入的视频



我正在尝试将YouTube视频嵌入到我的网站上的页面。我使用的正是https://developers.google.com/youtube/iframe_api_reference:

中指定的代码
<div id='player'></div>"
<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('player', {
       height: '940',
       width: '528',
       videoId: 'the_embed_code'
    });
  }
</script>

这成功地嵌入了视频播放器在我的页面,在适当的地方。但是,它添加了一些样式参数,将包含播放器的iframe调整为300px * 150px。以上代码生成的iframe如下所示:

<iframe id="player" class="vjs-paused" width="940" height="528" 
    style="width: 300px; height: 150px;" frameborder="0" 
    allowfullscreen="1" title="YouTube video player" 
    src="http://www.youtube.com/embed/the_embed_code?enablejsapi=1&amp;origin=http%3A%2F%2Fmy.domain.com">
</iframe>

我不知道这些参数是从哪里来的;在(Mac) Chrome, Safari, Firefox,甚至iPad Safari和Chrome上都是如此。onYouTubeIframeAPIReady函数正在被调用,在什么似乎是一个适当的时间。有什么建议吗?

问题(大部分)解决了——我似乎有一些jQuery代码不能完全很好地相互配合。一旦我将包含播放器的div的ID更改为"player"以外的内容,事情就开始正常工作了。我不确定问题到底是什么(也就是说,谁/什么是罪魁祸首),但至少有一个简单的解决方法。

我刚刚遇到了同样的问题:错误的视频嵌入尺寸。我注意到我的媒体嵌入显示为"media_embed",所以我将其更改为"player",瞧,效果很好。谢谢你的帮助,这是如此伟大的解决这个问题!

相关内容

  • 没有找到相关文章

最新更新