Disable jQuery Plugin on Mobile only?

Question

I have a jQuery plugin attached to an element, and I want to stop that plugin from working only on Mobile. I also have another plugin attached, a light box, but I want to stay regardless if someone is on mobile or desktop.

This is the plugin I want to stop on Mobile: https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

Here is the code:

// Adding in the plugin
$(function() {
    $(playlist).swipe({
        swipeStatus:function(event, phase, direction, distance, duration) {
           // code for swipy stuff here ....
           // ...
           // ...
        }
 });

// Trying to remove the plugin
window.onresize = function(event) {
        var deviceWidth = $(window).width();

        if(deviceWidth <= 768) {
            $(playlist).swipe({
                swipeStatus:function(event, phase, direction, distance, duration) {
                    event.preventDefault();
                    event.stopPropagation();
                },
                threshold: 0,
                fingers:'all'
            });
        }
    };

Let me know if you got any ideas. I've also tried detaching the playlist and reattaching it to the DOM and that didn't work either.

Thanks!

score 0 · Answer 1 · answered May 16 '17 at 00:11

You can verify if the user agent is not a mobile device and init your plugin.

Demo:

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

if(!isMobile()) {
    $(playlist).swipe({
        swipeStatus:function(event, phase, direction, distance, duration) {
            event.preventDefault();
            event.stopPropagation();
        },
        threshold: 0,
        fingers:'all'
    });
}

Disable jQuery Plugin on Mobile only?

1 Answers1