PRATIQUE CLIENTS WEB 
Obtenir l'espace disponible au sein du navigateur
 
"Comme puis-je connaître précisément la hauteur et la largeur disponible pour l'affichage de mon site Web ?" (26/09/2005)
  Forum

Réagissez dans les forums de JDN Développeurs

La résolution d'écran reste l'une des grandes problématiques de la création de site Web. Avec l'amélioration des écrans et la baisse de leurs coûts, les développeurs doivent prévoir aussi bien pour les résolutions en 800*600 (voire 640*480 selon la population visée), jusqu'à 1280*1024 - sans compter ceux disposant de deux écrans.

Mais pour autant, un navigateur n'affiche pas les sites sur toute cette surface libre. Il y a son interface, d'abord (bouton, barre d'état, menus...), mais également les possibles barres d'outils qui y sont rattachées (Google Toolbar et consorts), les éléments d'applications tierces (le démarreur rapide d'Office par exemple), la barre standard Windows... Résolution ne veut donc pas dire surface libre.

Différentes méthodes existent selon le navigateur et sa version, donc la meilleure manière de s'y prendre est de tester l'existence d'une méthode donnée, et de l'utiliser si elle est présente :

var largeur = 0, hauteur = 0;
if( typeof( window.innerWidth ) == 'number' ) {
  largeur = window.innerWidth;
  hauteur = window.innerHeight;
  }
else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
  largeur = document.documentElement.clientWidth;
  hauteur = document.documentElement.clientHeight;
  }
else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
  largeur = document.body.clientWidth;
  hauteur = document.body.clientHeight;
  }
else {
  largeur = -1;
  hauteur = -1;
  }
 
Xavier Borderie, JDN Développeurs
 
 
Accueil | Haut de page