Disable .js file for specific media query?

Question

I want to disable my .js file when a browser window is less than 1000px but I also want to disable it for specific devices / media queries.

So for example, I want to make sure it doesn't load on iPad.

I have got the 1000px part sorted but I am not sure how to also implement the media query?

<script>
$(function() {
var windowWidth = $(window).width();
if(windowWidth > 1000){
    skrollr.init({
        forceHeight: false
    });
}});
</script>

It is AFAIK not possible. Use mobiledetect.net ( my choice ) if you can use PHP! — loveNoHate
– loveNoHate, Commented Sep 15, 2014 at 12:09
This should help with your problem: stackoverflow.com/questions/3514784/… — bencripps
– bencripps, Commented Sep 15, 2014 at 12:09
Oh, I got the question the other way around. JS in media-query. Look here: davidwalsh.name/add-rules-stylesheets. — loveNoHate
– loveNoHate, Commented Sep 15, 2014 at 12:12

Community · Accepted Answer · 2017-05-23 10:33:38Z

1

You need to detect the userAgent, as seen here : What is the best way to detect a mobile device in jQuery?

In your code :

<script>
        $(function() {
             var windowWidth = $(window).width();
          if(windowWidth > 1000 && !(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))){
           skrollr.init({
           forceHeight: false
          });
          }});
    </script>

edited May 23, 2017 at 10:33

CommunityBot

11 silver badge

answered Sep 15, 2014 at 12:11

ovi

5761 gold badge4 silver badges17 bronze badges

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

1 Comment

Alistair Over a year ago

Thanks - This is exactly what I was trying to find!

Collectives™ on Stack Overflow

Disable .js file for specific media query?

1 Answer 1

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Linked

Related