5. HTML5 Custom Video Player Controls JavaScript Full Screen Tutorial


Lesson Code: http://www.developphp.com/video/JavaScript/Video-Full-Screen-Toggle-Custom-Player-Controls-Tutorial
Part 5 focuses on creating a custom full screen button for your custom video controls bar. This is all experimental technology until HTML5 and some new JavaScript methods becomes standardized. HTML5 and CSS3 modules are still in development by various browser vendors.


21 thoughts on “5. HTML5 Custom Video Player Controls JavaScript Full Screen Tutorial”

  1. http://prime3pl.com/?page_id=2 union select 0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526,0x5e2526-- Hello, I stopped by for express my appreciation. These "how to customize your vp controls" series are really useful. There are lots of online source but it works as it supposed to be completely and accurately. Congrats bro,

    source a lady.

  2. For those who can't get their code to work try this:

    Note: replace elem with whatever the id of your video is called:

    var elem = document.getElementById("myvideo");
    if (elem.requestFullscreen) {
    } else if (elem.msRequestFullscreen) {
    } else if (elem.mozRequestFullScreen) {
    } else if (elem.webkitRequestFullscreen) {

  3. is anyone having any issues with full screen not working with Chrome?  Note:  the only thing I can find from many a Google search is that webkit now uses a lowercase s in screen instead of a capital S.  But the full screen button still does not work on chrome.

  4. Hi Adam! Thanks a lot for this tutorial!

    I was wondering: is there any method to show controls while extending fullscreen under Mozilla FF? As you showed us, this seem to be impossible with this method, but I want to be sure….

    Thanks a lot again!

Leave a Reply

Your email address will not be published. Required fields are marked *