YouTube iframe api正在调整尺寸错误的嵌入式视频大小

时间:2013-05-18 01:00:17

标签: video youtube youtube-api youtube-javascript-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函数正在调用,似乎是一个合适的时间。有什么建议吗?

2 个答案:

答案 0 :(得分:0)

问题(大部分)已经解决了 - 我似乎有一些jQuery代码不能完全相互发挥。一旦我将包含播放器的div的ID更改为“播放器”之外的其他内容,事情就开始正常工作了。我不确定问题究竟是什么(即,罪魁祸首是谁/什么),但至少有一个简单的解决方法。

答案 1 :(得分:0)

我遇到了同样的问题:错误的视频嵌入大小调整。我注意到我的媒体嵌入了“media_embed”,所以我将其改为“播放器”,并且它很有效。感谢您对此的帮助,解决这个问题真是太棒了!