How to disable my javascript for mobile devices

Question

I broke my head trying to disable the following javascript for mobile devices. I'm a dummy in javascript so would appreciate any help.

$(window).scroll(function() {
    if($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-sticky').addClass('sticky');
    } else {
        $('.navbar-sticky').removeClass('sticky');
    }
});

[How do I remove scripts for responsive mobile](https://stackoverflow.com/questions/11335684/how-do-i-remove-scripts-for-responsive-mobile) — Sudhir Ojha, Apr 17 '19 at 07:48
Possible duplicate of [How do I remove scripts for responsive mobile](https://stackoverflow.com/questions/11335684/how-do-i-remove-scripts-for-responsive-mobile) — Chris G, Apr 17 '19 at 07:50

Chandan Kumar · Answer 1 · 2019-04-17T07:56:10.783

You can add given below code on starting point of javascript and return if it is any mobile device

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|Windows Phone/i.test(navigator.userAgent)) {
        return 
}

$(window).scroll(function() {
    if($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non opaque*/ 
    {
        $('.navbar-sticky').addClass('sticky');
    } else {
        $('.navbar-sticky').removeClass('sticky');
    }
});

score 0 · Answer 2 · answered Apr 17 '19 at 07:50

Check $(window).width:

$(() => {
    if ($(window).width > 481) {
        $(window).scroll(function() {
            if($(this).scrollTop() > 50) {
                $('.navbar-sticky').addClass('sticky');
            } else {
                $('.navbar-sticky').removeClass('sticky'); 
            }
        });
    }
});

score 0 · Answer 3 · answered Apr 17 '19 at 07:51

You can check if you are loading website on mobile and add conditon before you run you code i don't have resources to test this out but hope this helps you

        var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
        var element = document.getElementById('text');
        if (isMobile) {
            //dont use 
        } else {
            $(window).scroll(function() {
                   if($(this).scrollTop() > 50)  /*height in pixels when the navbar becomes non 
                 opaque*/ 
                {
                $('.navbar-sticky').addClass('sticky');
                } else {
                 $('.navbar-sticky').removeClass('sticky');
               }
            });
        }

score 0 · Answer 4 · answered Apr 17 '19 at 07:54

0

You can try this simple CSS.

@media screen and (max-width:479px){
#mobile-header {
  position: Static !important;
}

answered Apr 17 '19 at 07:54

Khushbu Vaghela

735
2
5
16

How to disable my javascript for mobile devices

4 Answers4