(animation testé sur chrome ie et ff derniere version)
j ai un div conteneur que je fais passé en full screen via un requestfullscreen(la aucun probleme a part pour ie ou il faut obligatoirement un evenement click) ensuite je recalcule les dimensions de mon div contenu
1ere méthode: j utilise
/*j ecoute evenement fullscreenchange*/
document.addEventListener("fullscreenchange", function () {
inmonFullScreen = !inmonFullScreen;onResize();
}, false);
document.addEventListener("mozfullscreenchange", function () {
inmonFullScreen = !inmonFullScreen;onResize();
}, false);
document.addEventListener("webkitfullscreenchange", function () {
inmonFullScreen = !inmonFullScreen;onResize();
}, false);
document.addEventListener("MSFullscreenChange", function () {
inmonFullScreen = !inmonFullScreen;onResize();
}, false);
ca fonctionne bien mais il y a un probleme ( ie et chrome):
si dans onResize je fais conteneur.clientHeight et normalement je devrais obtenir =hauteur ecran et en faite j obtiens une hauteur légèrement inferieure ( je suppose que lorsque evenement fullscreenchange est "fired" l élément n est pas encore completement en plein ecran) donc ca m oblige a utiliser screen.height pour calculer dimension contenu(contenu.style.height=100% donne pas bonne valeur)
2eme methode:
je place un evenement onresize
window.addEventListener("resize", onResize, false);
et la ca marche bien conteneur.clientHeight est bien égal a hauteur écran quand onResize est lance
il suffit de tester si je suis bien en fullscreen
onResize=function(){
if(inmonFullScreen ){
calculdimcontenu();
}
else {
calculdimcontenu();
}
je préférai 1ere méthode plus jolie mais bon......
(avec ff pas ce problème mais il ne me donne pas bonne dimension ecran pourtant je fais zoom=100%???...)