How reliable a method is this to detect zoom % on iPhone_问答_开发者

How reliable a method is this to detect zoom % on iPhone

开发者 https://www.devze.com 2023-02-11 18:01 出处：网络

// Init var initialWidth = window.innerWidth; // Called when zoomed in function handleResize(){ // Viewport dimension, this is affected by zoom

    // 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 thi开发者_开发知识库s 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%?

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.