Obtenir la position de la fenêtre du navigateur quel que soit le zoom

Comment puis-je obtenir le bord gauche de la fenêtre du navigateur (menu, bordure, légende, etc.) sans qu'il soit "corrigé" pour prendre en compte le niveau de zoom? (This question répond à la question de base, mais ne considère pas le zoom.). Window.screenLeft ou window.screenX fonctionnent correctement sur Chrome et Safari, mais ils affichent des valeurs "fixes" avec IE6, IE8 et Firefox. J'ai considéré que je peux obtenir la taille de l'écran plus fiable, et peut-être déterminer le facteur de zoom en utilisant cela ou screen.deviceXDPI, mais je ne sais pas comment je voudrais utiliser cela pour corriger la position. Certains d'entre vous se demandent probablement pourquoi je veux faire cela parce qu'un site web d'entraînement ouvre une fenêtre de navigateur sur le côté droit de l'écran de l'utilisateur Le navigateur communique avec mon application en utilisant la balise de script . l'application veut se redimensionner il correspond exactement à la gauche de la fenêtre du navigateur)Obtenir la position de la fenêtre du navigateur quel que soit le zoom

EDIT

je l'ai mentionné deux choses:.

je demande sur le navigateur de zoom que vous pouvez généralement accéder à partir d'une vue m enu ou en maintenant la touche Ctrl enfoncée et en tournant la molette de la souris. Étant donné que la plupart des pages Web ne sont pas en mesure de répondre aux changements de taille de police par défaut (par exemple) sans masquer leur disposition, les navigateurs implémentent le zoom en mettant à l'échelle toutes les mesures, y compris les pixels. Pour garder les choses cohérentes, elles mesurent également la taille du client et de la fenêtre, les positions de la souris, etc. Le problème pour moi est que je veux les mesures réelles (non calibrées).
Je suis à la recherche d'une solution JavaScript.

Source

2010-10-14 Oliver Bock

-2

Si vous cherchez à faire une application plein écran Avez-vous envisagé ceci: An expanding middle in CSS

Jetez un oeil à la LIVEDEMO pour la réponse acceptée. Cette solution compense élégamment tous les effets dus au zoom.

Source

2011-03-06 23:54:36

Désolé, ne cherche pas à faire une application en plein écran. Essayer de savoir où se trouve la fenêtre du navigateur. –

Avez-vous vu How to detect page zoom level in all modern browsers?

Nous pouvons utiliser window.devicePixelRatio ou la méthode de recherche binaire suggéré là pour déterminer le rapport de pixels. Ensuite, nous escaladons window.screenX et window.screenY avec ce facteur:

J'ai testé cela dans Firefox 48 et la position de la fenêtre a changé avec au plus 2 pixels lors du changement du niveau de zoom. En utilisant window.devicePixelRatio ou la recherche binaire a donné essentiellement les mêmes résultats. Je suppose que 2 pixels de décalage peut être vraiment gênant pour les applications graphiques, mais déterminer le niveau de zoom semble être désordonné.

<html> 
 
    <head> 
 
    <meta charset="UTF-8"> 
 
    </head> 
 
    <body> 
 
    <input id="button" type="button" value="Click me!"/> 
 
    <style id=binarysearch></style> 
 
    <div id=dummyElement>Dummy element to test media queries.</div> 
 
    <script> 
 
     var mediaQueryMatches = function(property, r) { 
 
      var style = document.getElementById('binarysearch'); 
 
      var dummyElement = document.getElementById('dummyElement'); 
 
      style.sheet.insertRule('@media (' + property + ':' + r + 
 
\t \t   \t ') {#dummyElement ' + 
 
\t \t \t   '{text-decoration: underline} }', 0); 
 
      var matched = getComputedStyle(dummyElement, null).textDecoration 
 
\t   == 'underline'; 
 
      style.sheet.deleteRule(0); 
 
      return matched; 
 
     }; 
 

 
     var mediaQueryBinarySearch = function(
 
      property, unit, a, b, maxIter, epsilon) { 
 
      var mid = (a + b)/2; 
 
      if (maxIter == 0 || b - a < epsilon) return mid; 
 
      if (mediaQueryMatches(property, mid + unit)) { 
 
\t    return mediaQueryBinarySearch(property, unit, mid, b, maxIter-1, epsilon); 
 
      } else { 
 
\t    return mediaQueryBinarySearch(property, unit, a, mid, maxIter-1, epsilon); 
 
      } 
 
     }; 
 

 
</script> 
 
<script type="text/javascript">  
 
    var b = document.getElementById("button"); 
 
    b.onclick = function() { 
 
     var pixelratio = mediaQueryBinarySearch(
 
\t  'min--moz-device-pixel-ratio', '', 0, 6000, 25, .00001); 
 

 
     console.log("devicePixelRatio:", window.screenX * window.devicePixelRatio, window.screenY * window.devicePixelRatio); 
 
     console.log("binary search:", window.screenX * pixelratio, window.screenY * pixelratio); 
 
     console.log(Math.abs(pixelratio - window.devicePixelRatio)); 
 
    } 
 
    </script> 
 
    </body> 
 
</html>

Source

2016-08-08 23:20:50 YellowBird

Obtenir la position de la fenêtre du navigateur quel que soit le zoom

Répondre

Questions connexes