Kategorier
Diverse

Fullscreen

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>