oujood.com

L'objet Screen

L'objet screen contient des informations sur l'écran du visiteur

chercher |

Objet Screen

L'objet window.screen contient des informations sur l'écran de l'utilisateur telles que la résolution (c'est-à-dire la largeur et la hauteur de l'écran), la profondeur des couleurs, la profondeur des pixels, etc.

Puisque l'objet window se trouve au sommet de la chaîne de portée, on peut accéder aux propriétés de l'objet window.screen sans spécifier le préfixe window. Par exemple, window.screen.width peut être écrit screen.width. La section suivante vous montre comment obtenir des informations sur l'affichage de l'utilisateur en utilisant la propriété screen de l'objet window.

Remarque : Il n'y a aucune norme publique qui s'applique à l'objet screen, mais il est pris en charge dans tous les principaux navigateurs.

Propriétés de l'objet Screen

Propriété Description
availHeight Retourne la hauteur disponible de l’écran
availWidth Retourne la largeur de l’écran
colorDepth Retourne le nombre de bits de la palette de couleurs
height Retourne la hauteur totale de l'écran
pixelDepth Retourne la résolution en bit par pixels
width Retourne la largeur totale de l’écran

La propriété availHeight

Exemple Retourner la hauteur disponible de votre écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner la hauteur disponible
  de l'Ècran</title>
  </head>
   
  <body>
  <p id="dmo"> cliquez sur le bouton pour retourner la
  hauteur disponible de l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "hauteur disponible est : " + screen.availHeight + " px "
  ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation propriété availHeight

La propriété availHeight  renvoie la hauteur de l'écran du visiteur, en pixels, sans les éléments de l'interface comme la barre des tâches Windows.

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété availHeight n'est prise en charge dans tous les principaux navigateurs.

Syntaxe

screen.availHeight


La propriété availWidth

Exemple Retourne la largeur disponible de votre écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner la largeur disponible
  de l'Ècran</title>
  </head>
   
  <body>
  <p id="dmo"> cliquez sur le bouton pour retourner la
  largeur disponible de l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "largeur disponible : " + screen.availWidth + " px " ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation La propriété availWidth

La propriété availWidth  retourne la largeur de l'écran du visiteur, en pixels, moins les fonctionnalités de l'interface comme la barre des tâches Windows.

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété availWidth n'est prise en charge dans tous les principaux navigateurs.

Syntaxe

screen.availWidth


La propriété colorDepth

Exemple Retourne le nombre de bits de la palette de couleurs :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner nomre de bit de
  l'Ècran</title>
  </head>
   
  <body>
  <p id="dmo"> cliquez sur le bouton pour retourner le nombre
  de bits de la palette de couleurs pour l'affichage des images  de
  l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "Nombre de bit par px : " + screen.colorDepth  ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation La propriété colorDepth

La propriété colorDepth renvoie le nombre de bits de la palette de couleurs pour l'affichage des images (exprimée en bits par pixel).

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété colorDepth est prise en charge dans tous les principaux navigateurs.

Syntaxe

screen.colorDepth

Valeur de retour

Type Description
Nombre

Le nombre de bit de la palette de couleurs pour l'affichage des images, en bits par pixel. Valeurs possibles :

1 bit par pixel

4 bits par pixel

8 bits par pixel

15 bits par pixel

16 bits par pixel

24 bits par pixel

32 bits par pixel

48 bits par pixel


La propriété height

Exemple Retourner la hauteur totale de votre écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner la hauteur totale de
  l'Ècran</title>
  </head>
   
  <body>
  <p id="dmo"> cliquez sur le bouton pour voir la hauteur
  totale de votre l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "La hauteur totale est : " + screen.height+" px "  ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation La propriété height

La propriété height retourne la hauteur totale de l'écran du visiteur, en pixels.

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété height est prise en charge dans tous les principaux navigateurs.

Syntaxe

screen.height


La propriété pixelDepth

Exemple Retourner  la résolution de la couleur de votre écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner la résolution de
  l'écran</title>
  </head>
  <body>
  <p id="dmo"> cliquez sur le bouton pour voir la résolution
  de votre l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "La résolution de votre ecran est : " +
  screen.pixelDepth+" px "  ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation La propriété pixelDepth

La propriété pixelDepth renvoie la résolution de couleur (exprimée en bits par pixel) de l'écran du visiteur.

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété pixelDepth est prise en charge dans Internet Explorer 10, Firefox, Opera, Chrome et Safari.

Remarque : La propriété pixelDepth n'est pas prise en charge dans Internet Explorer 9 et versions antérieures.

Astuce : La propriété colorDepth représente la même chose que la propriété pixelDepth. Utilisez la propriété colorDepth qui est prise en charge dans tous les navigateurs.

Syntaxe

screen.pixelDepth

Valeur de retour

Type Description
Nombre

La résolution valeurs possibles :

1 bit par pixel

4 bits par pixel

8 bits par pixel

15 bits par pixel

16 bits par pixel

24 bits par pixel

32 bits par pixel

48 bits par pixel


La propriété width

Exemple Retourne la largeur totale de votre écran :

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple retourner la largeur totale de
  l'Ècran</title>
  </head>
   
  <body>
  <p id="dmo"> cliquez sur le bouton pour voir la largeur
  totale de votre l'Ècran.</p>
   
  <button onclick="myFunction()"> Voir</button>
   
  <script>
  function myFunction()
  {
  var x = "La largeur totale est : " + screen.width+" px "  ;
  document.getElementById("dmo").innerHTML = x ;
  }
  </script>
  </body>
  </html>

Définition et utilisation La propriété width

La propriété width retourne la largeur totale de l'écran du visiteur, en pixels.

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété width est prise en charge dans tous les principaux navigateurs.

Syntaxe

screen.width


Exemple Toutes les propriétés de l'écran

Exemple :       Copier le code

  <!doctype html>
  <html lang="fr">
  <head>
              <meta charset="UTF-8">
              <title>Exemple Toutes les propriétés de
  l'Ècran</title>
  </head>
   
  <body>
  <h3>Votre écran :</h3>
   
  <script>
  document.write("largeur/hauteur totale:") ;
  document.write(screen.width+"*"+screen.height) ;
  document.write("<br>") ;
  document.write("largeur/hauteur disponible:") ;
  document.write(screen.availWidth+"*"+screen.availHeight) ;
  document.write("<br>") ;
  document.write("profondeur de couleur:") ;
  document.write(Screen.ColorDepth) ;
  document.write("<br>") ;
  document.write("résolution:") ;
  document.write(Screen.pixelDepth) ;
  </script>
  </body>
  </html>
Par carabde 30 mars 2014



Voir aussi nos tutoriel :

Les sessions

PHP les sessions

les cookies

Les cookies : Définition et utilisation des cookies en javascript.

Les variables superglobales

Les variables superglobales