Wednesday, 23 January 2013

Going Fullscreen with HTML5



// Up until recently, having a web page running in full screen was not possible, left only for #Flash -based sites. The best you could do was remove the menu/location bars but still the window frame remained.

This has changed with the #HTML5 #Fullscreen API which allows handling full-screen capability of the browser via #javascript . Support for this exists in modern browsers http://bit.ly/10IhvXN, with the exception of Internet Explorer of course. The feature is actually in use on Google+ (press space when you view a photo to enter full screen) as well as Facebook (through an "Options" menu choice).

For more details on adding this to your site, see this analysis of the related functions http://bit.ly/XXunVA by John Dyer, including a jQuery code example. There is also another #jQuery plugin implementing the spec, screenfull.js, here http://bit.ly/Yn2c6s
(Screenshot from the Mozilla demo page http://bit.ly/TldSoH)

No comments:

Post a Comment