0

So I'm making a game, and after much consideration I've decided I want to make it fullscreen. I am using Chrome and have tried $("container").webkitRequestFullScreen();, but it's not working, even when I copy the files to my localhost server.

Is there something I'm missing? Is my code wrong? Here it is:

var cont = $("container");

if (cont.requestFullscreen) {
    cont.requestFullscreen();
}
if (cont.webkitRequestFullscreen) {
    cont.webkitRequestFullscreen();
}
if (cont.mozRequestFullscreen) {
    cont.mozRequestFullscreen();
}
if (cont.msRequestFullscreen) {
    cont.msRequestFullscreen();
}

So that's my code. cont is a reference to my container div.
Thanks in advance!

EDIT: I keep forgetting to mention this - my $ function is not jQuery, it's just returning document.getElementById(id);.

EDIT 2: And despite what StackOverflow says, I am not using IE! I am not even looking for IE support!

Derek 朕會功夫
  • 92,235
  • 44
  • 185
  • 247
Atutouato
  • 375
  • 4
  • 13
  • 1
    A jQuery object doesn't have any kind of `requestFullscreen` method. DOM objects do. Try `cont.get(0).requestFullScreen()`. – apsillers Jan 28 '14 at 02:35
  • This article shows how to use requestFullScreen and how to handle errors for various browsers - hope it helps! http://sorcery.smugmug.com/2012/06/06/using-html5s-fullscreen-api-for-fun-and-profit/ – flauntster Jan 28 '14 at 02:37
  • 2
    Sorry, I'm not using jQuery. I'll specify that in my OP. I'm using a simple `document.getElementById` function. – Atutouato Jan 28 '14 at 02:37
  • But then the `$("container")` is wrong, no? – Pekka Jan 28 '14 at 02:39
  • Just making the code shorter - I don't want to type `$("container")` every time. – Atutouato Jan 28 '14 at 02:39
  • 1
    Ah, OK. Anything in the error console? – Pekka Jan 28 '14 at 02:39
  • When I run `$("container").requestFullscreen();` or the Mozilla or IE prefixes, it returns an error that it is undefined, however, when I run the webkit prefixes, it just returns undefined. – Atutouato Jan 28 '14 at 02:41
  • @Derek朕會功夫, hmmm, I'll take a look and report back. – Atutouato Jan 28 '14 at 02:48
  • Okay, I did some fiddling and now it's going to fullscreen, but my canvas' background is completely white and I don't know how to fix that. – Atutouato Jan 28 '14 at 02:53

2 Answers2

1

Vote for the IE 11 fullscreen bug (limited to iframes) here:

https://connect.microsoft.com/IE/feedback/details/814527/ie11-iframes-body-offsetwidth-incorrect-when-iframe-is-in-full-screen-mode#tabs

mms
  • 535
  • 5
  • 7
0

Well, using the suggestion that @Derek linked to, I was able to fix the problem. However, now I have a blank wierd white canvas on the fullscreen, but that's another problem, so thanks for everyone who helped.

Atutouato
  • 375
  • 4
  • 13