title: Video.js enter fullscreen on play
body: <p>I've been searching around for a long time but still haven't found a valid solution for my problem. I just cant seem to get the video player to enter fullscreen. The API does have many examples but none of them seem to work.</p>
  
  <p>The jQuery version included on the page I am currently working on is 1.8.2. Also, I am using parallax-1.1.js and libraries required for it to work properly so that may also be an issue.</p>
  
  <p>The client I am working for wants the site to have responsive design, with <strong><em>the ability of the player to directly go to fullscreen when the "Play" button is clicked</em></strong>. This functionality should be avalable both on desktop, and mobile/tablet browsers. On the video page, there should be 3 video players, each of them has unique IDs, and they also have a common CSS class.</p>
  
  <p>Some of the code I tried didn't work well. Here's an example JS code snippet controlling one of the video HTML tags.</p>
  
  <p><strong>Example:</strong></p>
  
  <pre><code>player1 = _V_('video-1');
  
  player1.on("play",
      function () {
          this.requestFullScreen();
  });
  
  player1.on("ended",
      function () {
          this.cancelFullScreen();
  });
  </code></pre>
  
  <p>The code generates this error:</p>
  
  <pre><code>Uncaught TypeError: Object [object Object] has no method 'requestFullScreen'
  </code></pre>
  
  <p>I am working with the latest version of Google Chrome.</p>