How to make video play fullscreen automatically

2.5k views Asked by At

so I have this code to play the video on button click:

<!DOCTYPE html>
<html>
    <body>
        <script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
        <iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

        <script>
        $(function() {
            var iframe = $('#player1')[0];
            var player = $f(iframe);

            // When the player is ready, add listeners for pause, finish, and playProgress
            player.addEvent('ready', function() {
                player.addEvent('pause', onPause);
                player.addEvent('finish', onFinish);
                player.addEvent('playProgress', onPlayProgress);
            });

            // Call the API when a button is pressed
            $('button').bind('click', function() {
                player.api($(this).text().toLowerCase());
            });
        });
        </script>

        <div>
          <button>Play</button>
          <button>Pause</button>
        </div>
    </body>
</html>

Is there a way to make it fullscreen automatically when the play button is pressed?

0

There are 0 answers