Jak ustawić widok pełnoekranowy HTML5?

Question

Widziałem dziesiątki tutoriali na ten temat i wydaje się to proste. Wszystko, czego chcę, to uczynić mój element canvas HTML5 przejściem w tryb pełnoekranowy (jak w pełnym ekranie, zajmując cały monitor).

Tu jest mój HTML:

<p><canvas id="screen" width="800" height="500" 
    style="background: #FFFFFF; border: 5px solid black;" role="img"> 
     Your browser does not support the canvas element. 
</canvas></p> 

<p><a href="javascript:goFullScreen();">Go Fullscreen</a></p> 

Oto mój Javascript (w pliku .js własne):

function goFullScreen(){ 
    var canvas = document.getElementById("screen"); 
    if(canvas.requestFullScreen) 
     canvas.requestFullScreen(); 
    else if(canvas.webkitRequestFullScreen) 
     canvas.webkitRequestFullScreen(); 
    else if(canvas.mozRequestFullScreen) 
     canvas.mozRequestFullScreen(); 
} 

testowałem funkcji; zostaje wywołany i wywoływany jest jeden z trzech znaków if (mianowicie, ponieważ używam przeglądarki Firefox, mozRequestFullScreen). Moja przeglądarka otwiera ją na każdym testowanym przeze mnie egzemplarzu, ale nie w moim własnym kodzie.

Jaka jest brakująca zmienna? Muszę mieć Google dosłownie każdy link, który wspomina o tym i wciąż nic. Dzięki.

Answer 1

OK, znalazłem problem. To nie działa:

<p><a href="javascript:goFullScreen();">Go Fullscreen</a></p> 

to działa:

<p><button onclick="goFullScreen();">Go Fullscreen</button></p> 

Taa ... 3 godziny później.