CODEWITHSUNDEEP
htmlfullscreen
strider820
strider820

Reputation: 3720

Why is my custom fullscreen button not working?

I followed this tutorial on custom controls for a video, and I can't get the fullscreen button to work:

http://blog.teamtreehouse.com/building-custom-controls-for-html5-videos

Here is a jsfiddle:

http://jsfiddle.net/strider820/3CGdw/

// Event listener for the full-screen button
fullScreenButton.addEventListener("click", function() {
    if (video.requestFullscreen) {
        video.requestFullscreen();
    } else if (video.mozRequestFullScreen) {
        video.mozRequestFullScreen(); // Firefox
    } else if (video.webkitRequestFullscreen) {
        video.webkitRequestFullscreen(); // Chrome and Safari
    }
});

When I step through the fullscreen click, it appears to go where I would expect, but then the actual function call doesn't appear to do anything. What am I doing wrong???

Upvotes: 0

Views: 191

Answers (1)

mooyah
mooyah

Reputation: 76

Any video within an iframe will fail to go fullscreen if the iframe is missing the "allowfullscreen" attribute.

Upvotes: 1

Related Questions