To get the scale value on a mobile browser

Question

I am trying to understand responsive design and related concepts.I've conducted this test page: http://67.20.67.232/testscale.html. Looking at the value changing while adjustig the scale value, I draw a conclusion that ScaleValue = window.screen.width/window.innerWidth. But I searched around how to get the current scale value and didn't see anything similar. So I wonder if it is safe to say so. And, is there any other way to get the current scale value?

<html>
    <head>
    <meta name="viewport" content="">
     <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
        (function loop(){
            requestAnimationFrame(function(){
                $('#win').html( window.innerWidth );
                $('#screen').html( window.screen.width );
                loop();
            })
        })();
    </script>
    <style>
        .clr{clear:both}
        .left{float:left}
    </style>
    </head>
    <body style="margin:0;width:1250px;background:yellow;border:0px solid red">
        <div id="w" style="border:solid 5px black;margin-top:50px;margin-left:50px;font-size:40px">
            <div class="left">innerWidth:<span id="win"></span></div>
            <div class="left">screenWidth:<span id="screen"></span></div>
            <div style="clear:both"></div>
        </div>
    </body>
</html>

Maybe this helps you [CSS3 @media min-width & max-width][1] [1]: http://stackoverflow.com/questions/13550541/media-min-width-max-width — garatu, Aug 02 '15 at 22:26

To get the scale value on a mobile browser

0 Answers0