在 iPhone 上检测缩放百分比的方法有多可靠
// Init
var initialWidth = window.innerWidth;
// Called when zoomed in
function handleResize(){
// Viewport dimension, this is affected by zoom
var viewportwidth = window.innerWidth;
var zoomAmount = initialWidth/viewportwidth;
$('#lol').html('<p>Your viewport width is '+viewportwidth+'<br />Your native width is ' + initialWidth + '<br />Total zoom is ' + zoomAmount + '</p>');
}
然后在正文中:
<body onresize="handleResize()">
<div id="lol" style="font-size:30px;"></div>
在我的 MobiOne iPhone 模拟器上,它的准确度似乎在 +-7% 以内,但我没有真正的 iPhone 来测试这一点。这是一个好的解决方案,还是我以后会遇到问题?
主要问题是,如果页面加载预先放大,那么 % 会变得混乱,是否可以在放大的 iPhone 上打开网页,还是始终默认为 100%?
// Init
var initialWidth = window.innerWidth;
// Called when zoomed in
function handleResize(){
// Viewport dimension, this is affected by zoom
var viewportwidth = window.innerWidth;
var zoomAmount = initialWidth/viewportwidth;
$('#lol').html('<p>Your viewport width is '+viewportwidth+'<br />Your native width is ' + initialWidth + '<br />Total zoom is ' + zoomAmount + '</p>');
}
Then in the body:
<body onresize="handleResize()">
<div id="lol" style="font-size:30px;"></div>
It seems to be accurate within +-7% on my MobiOne iPhone simulator, but I don't have a real iPhone to test this on. Is this a good solution, or am I going to run into problems later?
The main issue is if the page loads pre-zoomed in then the %'s get messed up, is it ever possible to open a web page on an iPhone zoomed in or will it always default to 100%?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我无法真正评论这种技术的有效性,但是,我建议您甚至不应该尝试。一般来说,尝试强制或适应缩放级别并不是一个好主意 - 智能手机设备种类繁多,您不太可能能够可靠地检测/调整所有这些设备上的缩放级别。相反,我认为您最好花时间让您的网站在任何缩放级别上都看起来不错。
I can't really comment on how effective this technique will be, however, I would suggest that you probably shouldn't even try. Generally speaking trying to force or adapt to zoom levels isn't a great idea - there are a great variety of smart-phone devices, and it is very unlikely that you will be able to reliably detect / adjust the zoom levels on all of them. Instead I would argue that your time would be better spent trying to make your site look good at any zoom level.