2

So I have this code which looks something like this and plays YouTube videos:

// 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);

Is it possible to make the video fill out the screen (100% width and 100% height)?

ALSO, I'm wondering if it's possible to make the video autoplay?

--

EDIT: the autoplay problem has been fixed but the full screen width and height issue remains, I have tried to implement the following code to no avail:

<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>
Raz
  • 119
  • 1
  • 3
  • 13
  • 1
    To have the swf fill the entire browser window (or rather its parent element) you can use "100%" instead of a numeric width and height. So like swfobject.embedSWF("http://www.youtube....", "videoDiv", "100%", "100%", ... – Lars Blåsjö Feb 17 '13 at 11:26

1 Answers1

0

See this question for obtaining how big the screen is. You could then use these values in place of where you have 800, 600 which is where I believe you have height and width of the player.

Then just add &autoplay=1 after the video ID. Source.

EDIT: I found another question that covers screen resolutions. How to get screen resolution of visitor in javascript and/or php?

Community
  • 1
  • 1
Phil Bozak
  • 2,745
  • 1
  • 17
  • 27
  • The autoplay solution worked but the full screen issue remains, please check my code above, was that how you meant, I bet not : )? – Raz Feb 17 '13 at 06:54
  • You probably want `$(window).width().toString()` and `$(window).height().toString()`. I read they must be strings. Also, you don't need all the "window"/"document" stuff at the top. Those were just examples of how to use it. – Phil Bozak Feb 17 '13 at 07:20
  • How exactly do you mean? "videoDiv", $(window).height().toString(), $(window).width().toString(), "8", null, null, params, atts); – Raz Feb 17 '13 at 09:44
  • Yes, that's what I mean, sorry. – Phil Bozak Feb 17 '13 at 17:25