动态禁用Jquery插件/函数

所以我在网站上有一个幻灯片，当窗口大小是移动的时候，我只想看一个列表。我在想，是否有办法禁用jquery插件或window resize上的函数来禁用滑动并为幻灯片列表创建移动样式

你认为最好的方法是什么

---

谢谢

检查请求是否来自$\u服务器['HTTP\u USER\u AGENT']，并检查该用户\u AGENT是否是移动浏览器或使用插件来完成此部分

---

如果请求来自手机，那么。重定向到您的移动页面。

在调用插件之前检查窗口大小。例如：

height = $(window).height();
width = $(window).width();
if(height > 300 || width > 200) {
  // Initialize plugin
}

或者，如果您想启动它，然后在窗口太小时停止它（假设插件有办法禁用自己）：

$（窗口）。调整大小（函数（）{
高度=$（窗口）.height（）；
宽度=$（窗口）.width（）；
如果（高度<300 | |宽度<200）{
//停止插件
}
});

使用带有

teardown（）

或

destroy（）

方法的幻灯片，该方法能够删除它创建的任何元素和事件侦听器

任何使用jQueryUI小部件工厂的jQuery插件都会有这个功能，但不幸的是，其他许多插件没有。您可以尝试此旋转木马，只需确保包含jQuery小部件工厂：

其次，不要试图嗅探设备是否是移动设备，不要停留在设备方面思考。如果用户想在手机上查看旋转木马怎么办？如果他们的设备被错误地解释为移动设备怎么办？做出假设可能会反过来伤害你。检测特征和属性更安全，并且应该更适合未来

考虑一下您试图解决的问题，如果是“如果在小视口中以列表形式显示此幻灯片，效果会更好”，那么在实例化插件之前，请继续检查窗口的大小或使用

matchMedia（）

测试媒体查询（为什么所有工作都只是为了再次撤销它）如果视口大小调整或设备方向更改，则再次显示

在纯JS中（对于相对最新的浏览器），可能类似于：

var slideshowControl = function(element, breakpoint) {

    var api;

    var initSlideshow = function() {
        api = new Slideshow(element);
    };

    var removeSlideshow = function() {
        api.teardown();
        api = undefined;
    };

    // Test media query
    return function() {

        // Test if match media is available
        var matchMedia = window.matchMedia || window.msMatchMedia;

        if ( ! matchMedia) {
            return;
        }

        if (matchMedia('all and (max-width:' + breakpoint + ')').matches && ! api) {
            return initSlideshow();
        }

        if (matchMedia('all and (min-width:' + breakpoint + ')').matches && api) {
            return removeSlideshow();
        }
    };

}(document.querySelector('.slideshow'), 640);

window.addEventListener('resize', slideshowControl);
window.addEventListener('DOMContentLoaded', slideshowControl);

---

许多jQuery小部件都有一个

destroy（）

方法来实现这一点。或者在启动小部件之前检查窗口大小。无法从桌面连接到移动设备。@Barmar，看来第二个选项可能是更好的解决方案。谢谢！但问题是我不知道如何停止插件。该插件仅从我创建的图像列表中生成一组div。（对于标题、幻灯片导航等），但我只想在它达到移动大小时保持简单。有什么想法吗？我想第一段代码对你来说会很好。决定使用插件的最小大小，并将这些数字输入。这将阻止插件从一开始就启动。谢谢！我不太喜欢为手机创建网站。但也许我会尝试用我的移动css来实现这一点。

var slideshowControl = function(element, breakpoint) {

    var api;

    var initSlideshow = function() {
        api = new Slideshow(element);
    };

    var removeSlideshow = function() {
        api.teardown();
        api = undefined;
    };

    // Test media query
    return function() {

        // Test if match media is available
        var matchMedia = window.matchMedia || window.msMatchMedia;

        if ( ! matchMedia) {
            return;
        }

        if (matchMedia('all and (max-width:' + breakpoint + ')').matches && ! api) {
            return initSlideshow();
        }

        if (matchMedia('all and (min-width:' + breakpoint + ')').matches && api) {
            return removeSlideshow();
        }
    };

}(document.querySelector('.slideshow'), 640);

window.addEventListener('resize', slideshowControl);
window.addEventListener('DOMContentLoaded', slideshowControl);