L'objet screen contient des informations sur l'écran du visiteur
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é | 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 |
<!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>
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
La propriété availHeight n'est prise en charge dans tous les principaux navigateurs.
Syntaxe
screen.availHeight
<!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>
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
La propriété availWidth n'est prise en charge dans tous les principaux navigateurs.
Syntaxe
screen.availWidth
<!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>
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
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 |
<!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>
La propriété height retourne la hauteur totale de l'écran du visiteur, en pixels.
Appui de navigateur
La propriété height est prise en charge dans tous les principaux navigateurs.
Syntaxe
screen.height
<!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>
La propriété pixelDepth renvoie la résolution de couleur (exprimée en bits par pixel) de l'écran du visiteur.
Appui de navigateur
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 |
<!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>
La propriété width retourne la largeur totale de l'écran du visiteur, en pixels.
Appui de navigateur
La propriété width est prise en charge dans tous les principaux navigateurs.
Syntaxe
screen.width
<!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>
Livre numérique court pour comprendre la méthode secrète permettant d'obtenir des likes sans fin sur Facebook.
GAGNER DE L'ARGENT