Programmatically put Google Chrome into full-screen mode with Javascript?

Question

I was on youtube recently when I clicked the fullscreen button by the youtube video and a message appeared at the top of the screen saying that I was put into full-screen mode. This message was the native message you get when pressing f-11 on your keyboard. I also read something somewhere(that I now cannot find) saying that it's now possible to do this with Javascript.

Question

How would I put the users browser(Google Chrome) into fullscreen, on command? - without an extension they would need to download prior, or anything of that nature.

I'm using jQuery so that would be best, but I can't find how to do it at all.

EDIT: I've seen other questions of this nature, but they were asked a long time ago, and I believe this functionality is fairly new.

Do you have a link to the YouTube video that does this? Are you sure it wasn't Flash? — Jared Farrish, Nov 04 '11 at 21:37
possible duplicate of [Is there a way to make HTML5 video fullscreen?](http://stackoverflow.com/questions/1055214/is-there-a-way-to-make-html5-video-fullscreen) — Kirk Woll, Nov 04 '11 at 21:38
I get different message with fullscreen from youtube than I get from pressing F11 — yunzen, Nov 04 '11 at 21:39
You can also view this technique done in Google Docs by viewing a doc and pressing the fullscreen button, it is definitely not done in flash. — android.nick, Nov 06 '11 at 02:47

score 10 · Accepted Answer · answered Nov 04 '11 at 21:43

Here is good article: Native Fullscreen JavaScript API . It describes all three methods: webkit, firefox and W3-proposal.

// mozilla proposal
element.requestFullScreen();
document.cancelFullScreen(); 

// Webkit (works in Safari and Chrome Canary)
element.webkitRequestFullScreen(); 
document.webkitCancelFullScreen(); 

// Firefox (works in nightly)
element.mozRequestFullScreen();
document.mozCancelFullScreen(); 

// W3C Proposal
element.requestFullscreen();
document.exitFullscreen();

score 1 · Answer 2 · answered Nov 04 '11 at 21:38

1

Try these functions, they appear to be native:

void webkitRequestFullScreen();
void webkitRequestFullScreenWithKeys();
void webkitCancelFullScreen(); // only on Document

answered Nov 04 '11 at 21:38

Marc DiMillo

513
5
17

score 1 · Answer 3 · edited Feb 23 '12 at 13:46

1

The API is still heavily in flux especially since the W3C joined in this week. I spent some time working through the differences to implement Full Screen in MediaElement.js HTML5 video player, and its working great in Safari 5.1+, Chrome 15+, or Firefox Nightly.

edited Feb 23 '12 at 13:46

Stephen

1,737
2
26
37

answered Feb 23 '12 at 11:45

Rack-Mount Monitor

11
2

Programmatically put Google Chrome into full-screen mode with Javascript?

3 Answers3

Linked