动态禁用jquery插件/功能

所以我在网站上有一个幻灯片，当窗口大小是可移动的时候，我想转到一个列表。我在想，如果有一种方法来禁用jquery插件或窗口大小的功能来禁用滑动并为幻灯片列表创建移动样式。动态禁用jquery插件/功能

您认为最好的方法是做什么？

谢谢！

来源

2013-04-23 KT.

很多jQuery的小部件有一个'破坏（）'方法，将做到这一点。 – Barmar 2013-04-23 04:37:51

或者只是在启动widget之前检查窗口大小。连接不能从桌面移动到移动。 – Barmar 2013-04-23 04:39:29

@Barmar，看起来像第二个选项可能是更好的解决方案 – 2013-04-23 06:15:23

-1

检查请求是否来自$ _SERVER ['HTTP_USER_AGENT']并检查user_agent是移动浏览器还是使用插件来完成此部分。

http://detectmobilebrowsers.com/

如果请求来自移动来呢。重定向到您的移动页面。

来源

2013-04-23 04:39:42

谢谢！我并不是完全想创建一个移动网站。但也许我会尝试用我的手机CSS来做到这一点。 – 2013-04-23 06:14:38

来自downvoter的任何评论？ – 2013-04-25 04:06:43

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

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

或者，如果你想要启动它，然后在窗口变得太小阻止它（假设该插件将有一个方法来禁用本身）：

$(window).resize(function() { 
    height = $(window).height(); 
    width = $(window).width(); 
    if(height < 300 || width < 200) { 
    // Stop plugin 
    } 
});

来源

2013-04-23 04:44:25

谢谢！但事情是我不知道如何停止插件。该插件仅从我创建的图像列表中生成一串div。（对于标题，幻灯片导航等），但我只是想保持简单，当它达到手机的大小。有任何想法吗？ – 2013-04-23 06:13:27

我认为代码的第一部分可以很好地满足您的需求。决定你希望使用插件的最小尺寸是多小，并将这些数字放入。这将阻止插件首先启动。 – 2013-04-23 17:25:47

使用使用teardown()或destroy()方法可以删除它创建的任何元素和事件侦听器。

任何使用jQuery UI小部件工厂的jQuery插件都会有这个，但不幸的是许多其他人不这样做。你可以试试这个轮播https://github.com/richardscarrott/jquery-ui-carousel，只要确保包含jQuery Widget工厂：http://jqueryui.com/widget/

其次不要试图嗅探设备是否是移动设备，不要在设备方面卡住思考。如果用户想要在手机上查看传送带，该怎么办？如果他们的设备被错误地解释为移动设备会怎么样？做出假设可能会回来咬你。检测功能和属性更安全，应该更加面向未来。

想想你正试图解决的问题，如果是“这个幻灯片会更好地工作，如果作为一个小视口列表呈现”然后继续检查窗口的大小或测试媒体查询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);

来源

2013-04-23 15:10:49

动态禁用jquery插件/功能

回答

相关问题