Changeset 26743

Timestamp:

12/06/2013 08:49:46 PM (11 years ago)

Author:

azaozz

Message:

Responsive menu: fix calculation of the responsive trigger width from JS. It is affected by a vertical scrollbar width in some browsers. See #26458.

File:

• trunk/src/wp-admin/js/common.js (modified) (2 diffs)

trunk/src/wp-admin/js/common.js

@@ -185 +185 @@
         $('#adminmenu div.wp-submenu').css('margin-top', '');
 
-        // WebKit excludes the width of the vertical scrollbar when applying the CSS "@media screen and (max-width: ...)"
-        // and matches $(window).width().
-        // Firefox and IE > 8 include the scrollbar width, so after the jQuery normalization
-        // $(window).width() is 884px but window.innerWidth is 900px.
-        // (using window.innerWidth also excludes IE < 9)
-        respWidth = navigator.userAgent.indexOf('AppleWebKit/') > -1 ? $(window).width() : window.innerWidth;
+        if ( window.innerWidth ) {
+            // window.innerWidth is affected by zooming on phones
+            respWidth = Math.max( window.innerWidth, document.documentElement.clientWidth );
+        } else {
+            // Exclude IE < 9, it doesn't support @media CSS rules
+            return;
+        }
 
         if ( respWidth && respWidth < 900 ) {
@@ -604 +605 @@
 
         trigger: function() {
-            var width = navigator.userAgent.indexOf('AppleWebKit/') > -1 ? $window.width() : window.innerWidth;
+            var width;
+
+            if ( window.innerWidth ) {
+                // window.innerWidth is affected by zooming on phones
+                width = Math.max( window.innerWidth, document.documentElement.clientWidth );
+            } else {
+                // Exclude IE < 9, it doesn't support @media CSS rules
+                return;
+            }
 
             if ( width <= 782 ) {