Skip to content

JavaScript detects mobile screen size | Code

  • by

Use MDN recommends looking for “Mobi” anywhere in the User Agent to detect a mobile screen size (mobile device) in JavaScript. This will catch some tablets as well, which you need to be ready for and OK with.

navigator.userAgent.indexOf("Mobi") > -1

Read: Browser detection using the user agent

JavaScript detects the mobile screen size

A simple example code detects a mobile device from the browser if the screen size is what you care about:

<!DOCTYPE html>
<html>
<body>
  <script>
    var isMobile = Math.min(window.screen.width, window.screen.height) < 768 || navigator.userAgent.indexOf("Mobi") > -1;

    console.log("is Modible", isMobile)
  </script>
</body>
</html>

Output:

JavaScript detects mobile screen size

JQuery checks if the screen size

if ($(window).width() < 960) {
   alert('Less than 960');
}
else {
   alert('More than 960');
}

Do comment if you have any doubts or suggestions on this Js screen topic.

Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.

OS: Windows 10

Code: HTML 5 Version

Leave a Reply

Your email address will not be published. Required fields are marked *