how to get width of a mobiles using javascript

Question

so I try to get the width of the device using jquery I made responsive website with 2 interface for laptop and mobiles but the problem is it doesn't work in mobile even the dimension of the div test was out of size in mobiles please help me the code that I use for redirecting is below with comments

<html>
<head>
    <script src="./js/jquery-3.2.1.js"></script>
</head>
<body>
    <div id='test' style=" width: 2.54cm; height:2.54cm;"></div>
    //this div dimension works on laptop it measure exactly 2.54cm or 1nch
    //using ruler but in  mobiles it shrink and out of measure
    <script>
        //as you see I get the width of the div to get the pixel per inch
        var sqw=$('#test').width();
        var sqh=$('#test').height();
        //and I get the total width of the document
        var dheight=$(document).height();
        var dwidth=$(document).width();


    var w=dwidth/sqw;
    //and I divide the total width of the document to pixel per inch
    //the problem is the mobile show 10.98 inch where the mobile I use is 
    //miniFlare S5 cherrymobile with width of just 2.5 inches
    if(w<=7) {
        window.location.replace("./m_index.php");
    } else {
        window.location.replace("./d_index.php");
    }
</script>
</body>
</html>

Possible duplicate of Get the device width in javascript and how-to-programmatically-find-the-device-width — caramba
– caramba, Commented Mar 6, 2018 at 7:30

caramba · Accepted Answer · 2018-03-06 07:25:08Z

3

Your are using jQuery. From the docs .width() they say:

This method is also able to find the width of the window and document.

// Returns width of browser viewport
$( window ).width(); // <- this is the one you are looking for!

// Returns width of HTML document
$( document ).width();

answered Mar 6, 2018 at 7:25

caramba

22.5k20 gold badges94 silver badges134 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Godwin Romero Over a year ago

it doesn't work the width still show 980 pixel width in 2 1/2 inches maybe the problem is in the mobile I use

manish kumar · Accepted Answer · 2018-03-06 07:22:59Z

0

var dwidth = window.innerWidth;
var dheight = window.innerHeight;

would do the job

answered Mar 6, 2018 at 7:22

manish kumar

4,7184 gold badges39 silver badges52 bronze badges

Comments

GibboK · Accepted Answer · 2018-03-06 07:32:38Z

0

You can get cross platform using the following script:

const w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
const h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0)

answered Mar 6, 2018 at 7:32

GibboK

74.3k149 gold badges453 silver badges676 bronze badges

Comments

Venkat Ch · Accepted Answer · 2018-03-06 12:28:55Z

0

please try below code, it may satisfy your requirement <script> getScreensize(){ var sqw=$("body,html").width(); if(sqw<768){ //mobile screen logic } else{ //desktop screen logic } } $(window).resize(function(){ getScreensize(); }) </script>

answered Mar 6, 2018 at 12:28

Venkat Ch

7361 gold badge5 silver badges16 bronze badges

Collectives™ on Stack Overflow

how to get width of a mobiles using javascript

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related