Comment puis-je trouver un téléspectateurs de page web pixels par pouce?

Question

Quelqu'un peut-il penser à une manière que je peux découvrir un utilisateur pixels par pouce? Je veux faire en sorte que l'image affiche dans un navigateur web exactement la taille que je besoin, donc en utilisant une combinaison de la résolution (que je peux obtenir de l'agent utilisateur) et pixels par pouce que je pouvais faire cela.

Cependant, je ne sais pas s'il y a un moyen de découvrir un utilisateur pixels par pouce, de préférence en utilisant JavaScript ou une autre méthode non invasive.

Toutes les suggestions?

Merci,

CJ

Answer 1

Vous pouvez utiliser la fonction javascript ci-dessous pour obtenir le DPI.

<script type="text/javascript">
   var dpi = {
      v: 0,
      get: function (noCache) {
         if (noCache || dpi.v == 0) {
            e = document.body.appendChild(document.createElement('DIV'));
            e.style.width = '1in';
            e.style.padding = '0';
            dpi.v = e.offsetWidth;
            e.parentNode.removeChild(e);
         }
         return dpi.v;
      }
   }

    alert(dpi.get(true));  // recalculate
    alert(dpi.get(false)); // use cached value
</script>

Cependant, je pense qu'il retournera toujours 96 sur les machines Windows.

Pour autant que je sache, il n'y a aucun moyen pour le système d'exploitation pour déterminer les dimensions physiques réelles de la fenêtre. Ainsi, il se pourrait très bien qu'il est en fait impossible pour le logiciel de connaître la vie réelle DPI.

Cependant, les professionnels sont certaines branches assurez-vous que l'écran correspond à la DPI vie réelle DPI. Dans ces cas, le javascript ci-dessus serait probablement suffisante.

Remarque: Testé le code ci-dessus dans Opera 9, IE6 et 7 et Firefox 3.6 sur Windows XP et Win2K.

Mise à jour: Ajout de la nocache param. Mais je doute qu'il aura un effet. Je l'ai testé avec zoom dans Firefox et Opera sur les fenêtres mentionnées ci-dessus versions et ils continuent de citer le DPI comme « 96 », quel que soit le niveau de zoom. Ce serait intéressant de voir ce que les appareils mobiles font cela.

Answer 2

Vous pouvez faire comme les paquets de dessin anciens ont fait, et afficher une règle extensible. Demandez à vos utilisateurs glisser la règle virtuelle jusqu'à ce qu'il correspond à une règle physique, ils ont mis sur l'écran.

Pas une suggestion sérieuse pour l'utilisation de la production, mais probablement la seule façon d'obtenir effectivement la bonne réponse. (

Answer 3

Le plus sûr et le plus simple serait de dire au navigateur quelle taille vous voulez que l'image. CSS prend en charge les pouces et les paramètres, vous pouvez donc spécifier l'image comme l'un de ces exemples:

<img src="image.png" style="width:15cm;height:10cm;" alt="Centimeters" />
<img src="image.png" style="width:5.9in;height:3.9in;" alt="Inches" />
<img src="image.png" style="width:150mm;height:100mm;" alt="Millimeters" />

Answer 4

Affiche le soutien aujourd'hui 96px / pouce ou 72pixels / pouce .

Vous pouvez obtenir l'en-tête requête HTTP User-Agent

User-Agent: Mozilla/5.0 (Linux; X11)

celui-ci vous indiquera le système d'exploitation et de là vous pouvez prendre une décision.

Answer 5

Cela peut être très difficile - même si vous parvenez en quelque sorte à l'échelle l'image rendue en fonction de dpi, comment empêchez-vous l'utilisateur de redimensionner l'image dans son navigateur directement?

Avez-vous envisagé des technologies d'interface riches comme Flash ou Silverlight? Ils peuvent vous donner des options supplémentaires.