Disable jquery script for mobile devices

Question

I would like to disable following script when the website is opened in mobile device, because i don't want unnecesary animations:

<script src="js/eskju.jquery.scrollflow.js"></script>

In HTML this script works with these classes:

<div class="scrollflow -slide-right -opacity">
//some code...
</div>

I'm begginer, and I have little knowledge about JavaScript. Thanks in advance.

Have you tried Google? google.com.au/#safe=off&q=disable+javascript+file+on+mobile — Christian
– Christian, Commented Nov 18, 2015 at 3:28
Are you only taking about mobile device or it include all devices and tab. Disabling a script for view may not be a good idea.You will again need to enable it when the view changes and if you have plan to for fluid design — brk
– brk, Commented Nov 18, 2015 at 3:32
Yes, i googled and found multiple solutions, but as i said, i have very limited knowledge about javascript, so I need an answer precisely for this thing. I tried solutions that others posted, and none of them worked. — Ivan Miljkovic
– Ivan Miljkovic, Commented Nov 18, 2015 at 4:28
I think you may need to narrow down the requirement, "mobile device" is very broad. There are portable machines that support both touch and mouse events. Screen size is an increasingly difficult feature to filter anything with as well. So the first step could be, should it be disabled for anything supporting touch or a specific screen size? Or maybe even a combination of both... — Shikkediel
– Shikkediel, Commented Nov 18, 2015 at 4:50
It should be disabled for all touchscreen devices, such as smartphones and tablets. — Ivan Miljkovic
– Ivan Miljkovic, Commented Nov 18, 2015 at 4:54

Henry Tran · Accepted Answer · 2015-11-18 05:05:58Z

1

Add an ID to this script:

<script src="js/eskju.jquery.scrollflow.js" id="scScrollFlow"></script>

Add this javascript code at the bottom of your BODY:

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|Windows Phone/i.test(navigator.userAgent)) {
    $('#scScrollFlow').remove();
}

Update: I have tested it for you. This following solution will work fine:

First, open your file eskju.jquery.scrollflow.js, find and remove this code:

$( document ).ready( function()
        {
            new ScrollFlow();
        });

Add this javascript code to your site:

<script>
$( document ).ready( function()
{
    if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|Windows Phone/i.test(navigator.userAgent) == false) {
        new ScrollFlow();
    }
});
</script>

edited Nov 18, 2015 at 5:05

answered Nov 18, 2015 at 3:40

Henry Tran

5263 silver badges13 bronze badges

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

6 Comments

Ivan Miljkovic Over a year ago

Your answer seemed the most logical for me. I did everything as you said, but no luck.

Shikkediel Over a year ago

You can only use jQuery after document ready - and then the script has already been read. The other way around (actively creating the link) might work. Browser sniffing has been deprecated though.

Ivan Miljkovic Over a year ago

I'm sorry, I registered today and I don't know to handle JsFiddle :(

Henry Tran Over a year ago

I just updated the solution. See above. Logic is that we only init the ScrollFlow if the browser is not a mobile one.

Ivan Miljkovic Over a year ago

Yes, it works! I don't know how to thank you. I spent three hours figuring out how to solve this. Many, many thanks! Cheers!

|

Collectives™ on Stack Overflow

Disable jquery script for mobile devices

1 Answer 1

6 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Related