Look at this! mb.bgndGallery goes fullscreen!

[youtube_sc url=”http://www.youtube.com/watch?v=reS9Lp1LbLY” width=”700″ height=”400″]

I just implemented the new HTML5 Fullscreen API on two of my components: mb.YTPlayer and mb.bgndGallery.

Using the element.requestFullScreen() and the document.cancelFullScreen() methods is now possible to display part of a page or the entire web page in a real full screen view. All the browser UI is removed and only the required content is available fitting all the computer screen.

At the time it is a working draft and it’s not supported uniformly by the browsers. Firefox, Chrome and Safari have their implementation working, but Opera and IE actually don’t (probably available on the forthcoming release: http://caniuse.com/#feat=fullscreen).
Methods are still vendor prefix dependent so the code is repeated for each. Anyway here is a trick by that keeps things simpler.

See the demo
go to the download page