在Mobile Safari中从window.innerWidth获取不一致的结果 [英] Getting inconsistent results from window.innerWidth in Mobile Safari
问题描述
我正在使用此javascript检测浏览器宽度:
I'm using this javascript to detect the browser width:
$(document).ready(function(){
var width = window.innerWidth;
});
$(document).ready(function(){
var width = window.innerWidth;
});
似乎给出了不一致的结果. 我在这里制作了一个有效的Codepen .通过在移动Safari中反复刷新整页视图，我已经收到了以下两项信息:结果:
It appears to be giving inconsistent results. I've made a working codepen here. by repeatedly refreshing the full-page view in mobile Safari I've received both of the following results:
它前后不一致地跳动，并且页面尺寸变大(因此，所有图像)似乎会加剧.有时，它只会返回一个结果，直到我杀死该应用程序并重新打开它.
It jumps back and forth inconsistently, and appears to be exacerbated by a larger page size (hence all the images). Sometimes it will only return one result until I kill the app and re-open it.
有没有更好的方法来获取浏览器的宽度?
Is there a better way to get the width of the browser?
注意:
- 我已将此添加到头部:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> - 使用
$(window).width()并不是我真正的选择，因为它没有考虑滚动条 - 我知道我可以将js放入超时功能中，但是这种解决方案对我来说是个难题，因为我将结果存储在一个变量中，该变量在整个网站的各个地方都使用.
- 我正在使用运行iOS 9.2的iPhone 5
- I've added this to the head:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> - Using
$(window).width()isn't really an option for me because it doesn't account for scrollbars - I know I could put the js in a timeout function, but this solution is problematic for me since I'm storing the result in a variable that I'm using in various places throughout the website.
- I'm using an iPhone 5 running iOS 9.2
谢谢！
推荐答案
由于解析度，Safari在原始JavaScript中的宽度不一致. jQuery通常对此进行标准化.尝试使用:
Safari gets inconsistent widths in vanilla javascript because of the resolution. JQuery usually standardised this. Try using:
$(window).width()
这应该给您正确的宽度.
This should give you the right width.
这篇关于在Mobile Safari中从window.innerWidth获取不一致的结果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
