javascript - 是否可以让这个 YouTube 视频自动播放并填满 100% 的屏幕

标签 javascript html youtube flash

所以我有这段代码,它看起来像这样并播放 YouTube 视频:

// The "main method" of this sample. Called when someone clicks "Run".
  function loadPlayer() {
    // The video to load
    var videoID = "XjMQmXAJ3y4"
    // Lets Flash from another domain call JavaScript
    var params = { allowScriptAccess: "always"};
    // The element id of the Flash embed
    var atts = { id: "ytPlayer" };
    // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
    swfobject.embedSWF("http://www.youtube.com/v/" + videoID +
                       "&enablejsapi=1&playerapiid=player1",
                       "videoDiv", 800, 600, "8", null, null, params, atts);

是否可以让视频填满屏幕(100% 宽度和 100% 高度)?

另外,我想知道是否可以让视频自动播放?

--

编辑:自动播放问题已修复,但全屏宽度和高度问题仍然存在,我尝试实现以下代码无济于事:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document
$(window).width();   // returns width of browser viewport
$(document).width(); // returns width of HTML document
</script>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
  google.load("swfobject", "2.1");
</script>    
<script type="text/javascript">

var locationToRedirect = "http://URL.com";

  function EventListener(ev)
{

    if(!ev)
    {
        window.location.href = locationToRedirect;
    }
    else if(ev == 5)
    {
        ytpl = document.getElementById("ytPlayer");
        ytpl.playVideo();
    }

}
  function onYouTubePlayerReady(playerId) {
    ytplayer = document.getElementById("ytPlayer");
    ytplayer.addEventListener("onStateChange", "EventListener");
  }

  // The "main method" of this sample. Called when someone clicks "Run".
  function loadPlayer() {
    // The video to load
    var videoID = "XjMQmXAJ3y4"
    // Lets Flash from another domain call JavaScript
    var params = { allowScriptAccess: "always"};
    // The element id of the Flash embed
    var atts = { id: "ytPlayer" };
    // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
    swfobject.embedSWF("http://www.youtube.com/v/" + videoID +
                       "&enablejsapi=1&playerapiid=player1&autoplay=1",
                       "videoDiv", screen.height, screen.width, "8", null, null, params, atts);
  }
  function _run() {
    loadPlayer();
  }
  google.setOnLoadCallback(_run);
</script>

最佳答案

参见 this question用于获取屏幕的大小。然后,您可以使用这些值代替您拥有 800、600 的位置,我相信您拥有播放器的高度和宽度。

然后只需在视频 ID 后添加 &autoplay=1 即可。 Source .

编辑:我发现了另一个涉及屏幕分辨率的问题。 How to get screen resolution of visitor in javascript and/or php?

关于javascript - 是否可以让这个 YouTube 视频自动播放并填满 100% 的屏幕,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14917721/

相关文章:

javascript - AJAX在表单提交上上传图像

javascript - Cordova 插件不适用于 ionic

jquery - 基本的 jquery slider 图像大小不可调整

php - 如何下载 youtube 视频 php?

youtube - 关键字搜索返回YouTube API中视频的错误描述

java - 如何使用Java中的YouTube API检查YouTube视频是否存在?

javascript - 为什么videojs中不计算开始时间或显示空白

javascript - 简单 "Math"验证码

html - Chrome : Parts of outline on links remain after focus removed (when outline-style is explicitly to "auto")

html - 文本使固定宽度的 td 变大