How to disable some function in javascript when mobile device is use to open my webpage?

Question

How I can disable some of my js script function when mobile device is used to open my webpage? I can make it if it's on css only, but some button need to have function on js. this is my internal js code

var menuBtn = document.getElementById("menu")
var sideNav = document.getElementById("header")
var xBtn = document.getElementById("xBtn")
var slidePage = document.getElementById("main-page")

sideNav.style.right = "-250px";

menuBtn.onclick = function(){
    if(sideNav.style.right == "-250px"){
        sideNav.style.right = "0";
        menuBtn.style.display = "none";
        slidePage.style.left = "-9%";
    }
    else{
        sideNav.style.right = "-250px";
        menuBtn.style.display = "block";
    }
}

xBtn.onclick = function(){
        sideNav.style.right = "-250px";
        slidePage.style.left = "0";
        menuBtn.style.display = "block";
}

https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser , check this out — Fikfattt, Mar 17 '21 at 09:06
@FikriF i'm very new to javascript i don't have enough knowledge to understand your suggestion answer. It is now my problem because i only learn C programming language from my school, now I am struggling to understand basic syntax of different language. — Infinite Button, Mar 17 '21 at 09:20

score 0 · Answer 1 · answered Mar 17 '21 at 09:14

0

You can detect using this function.

function isMobile(){
    return window.innerWidth <= 600;
}

Happy coding :)

answered Mar 17 '21 at 09:14

Jakir Hossen

451
4
13

score 0 · Accepted Answer · answered Mar 17 '21 at 09:16

You can use matchMedia() for javascript to keep track of the width of the screen. If the screen width meets the specified conditions, then the specified function is disabled by returning a false. Like that:

if (window.matchMedia('(max-width: 767px)').matches) {
    function nameFunction() {
        return false;
    }
} else {}

score 0 · Answer 3 · answered Mar 17 '21 at 09:23

you can detect Mobile device with below function.

function isMobile(){
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ||
   (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.platform))) {
    return true;
}
    return false;
}

How to disable some function in javascript when mobile device is use to open my webpage?

3 Answers3