Firefox and Chrome har støtte for fullskjerm API-et. Med dette API-et så kan du ta tak i hvilket som helst element og vise det i fullskjermmoduls. Firefox legger til attributtene widh:100%; height:100% og vil strekke elementet slik at det fyller hele skjermen. Bruksområder her er f.eks. visning av bilde, videovisning med canvas for å nevne noe. Det er bare fantasien som setter begrensninger her.
Men fordelen er at du slipper å bruke javascript plugins for å løse dette.
Hvordan bruke fullscreen API?
Definer elementet som du ønsker å vise i fullskjermmodus slik (document.getElementById(‘myDiv’))
og kall funksjonen requestFullScreen
<button onclick="goFullscreen()">Vis fullskjerm</button> <div id="myDiv"> <canvas width="500" height="400" id="c">Dette er mitt canvas-element</canvas> </div>
Eksempel på kode:
<script> function goFullscreen() { var el = document.getElementById('myDiv'); if(el.webkitRequestFullScreen) { el.webkitRequestFullScreen(); } else { el.mozRequestFullScreen(); } } </script>