Comment puis-je obtenir la largeur de l'appareil de l'utilisateur, et non la largeur de la fenêtre, en JavaScript ?

Détection de la largeur de l'appareil en JavaScript

Question :

Comment pouvons-nous obtenir l'appareil de l'utilisateur largeur, distincte de la largeur de la fenêtre, en utilisant JavaScript ?

Réponse :

Les requêtes multimédias CSS fournissent une méthode pour cela en utilisant la propriété max-device-width. Cependant, lorsque nous travaillons avec des liaisons JavaScript, nous sommes souvent limités à l'accès à la largeur de la fenêtre d'affichage.

Solution élégante :

Pour résoudre ce problème avec élégance, nous pouvons utiliser l'écran. propriété width pour récupérer la largeur de l’écran de l’appareil. Dans certains cas, par exemple lorsqu'il s'agit de navigateurs de bureau où la taille de la fenêtre peut différer de la taille de l'écran de l'appareil, nous pouvons utiliser window.innerWidth à la place.

Compatibilité multiplateforme :

Pour une solution complète qui fonctionne à la fois sur les navigateurs mobiles et de bureau, considérez les éléments suivants :

var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;

Cela garantit que nous obtenons le corriger la largeur de l'appareil quel que soit le contexte de visualisation.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!