我在低分辨率下使用 iDangerous Swiper作为我的网站.这是我如何称呼它:
var resolution = 670;
if ($(window).width() < resolution) {
var mySwiper = $('.swiper-container').swiper({
    mode:'horizontal',loop: true,grabCursor: true,paginationClickable: true
});

因此,当您在桌面浏览器中访问它时,将不会调用滑动器.我想要做的是“如果用户将窗口大小调整为小于分辨率的大小,则将其打开”或者如果用户以小窗口大小访问窗口然后将其大小调整为大于分辨率,则将其销毁.我试过这个,但它不起作用:

$(window).resize(function(){
    if ($(window).width() < resolution) {
        if(typeof(mySwiper) === "undefined" ) {
            var mySwiper = $('.swiper-container').swiper({
                mode:'horizontal',paginationClickable: true
            });
        }
    } else {
        if (typeof(mySwiper) !== "undefined" ) {
            mySwiper.destroy();
        }
    }
});

发生两件令人不快的事

>如果用户的分辨率很小,并将其调整为仍然调用狙击手的分辨率,则会重新启动狙击手.
>如果用户处于较小的分辨率并将其调整为更大的分辨率,则不会被破坏.

我的问题是我的问题类型.当我们这样调用变量时,我不知道变量是如何工作的:$(‘.swiper-container’).swiper().

如何“取消”swiper以及如果已经调用它怎么不调用?

解决方法

我的解决方案
var mySwiper = undefined;
function initSwiper() {
    var screenWidth = $(window).width();
    if(screenWidth < 992 && mySwiper == undefined) {            
        mySwiper = new Swiper('.swiper-container',{            
            spaceBetween: 0,freeMode: true
        });
    } else if (screenWidth > 991 && mySwiper != undefined) {
        mySwiper.destroy();
        mySwiper = undefined;
        jQuery('.swiper-wrapper').removeAttr('style');
        jQuery('.swiper-slide').removeAttr('style');            
    }        
}

//Swiper plugin initialization
initSwiper();

//Swiper plugin initialization on window resize
$(window).on('resize',function(){
    initSwiper();        
});

而且它太棒了!

总结

以上是DEVMAX为你收集整理的jquery – 如果将窗口调整为更大的分辨率或在调整为较小的分辨率时调用它,则销毁iDangerous Swiper全部内容。

如果觉得DEVMAX网站内容还不错,欢迎将DEVMAX网站 推荐给好友。

jquery – 如果将窗口调整为更大的分辨率或在调整为较小的分辨率时调用它,则销毁iDangerous Swiper的更多相关文章

  1. css绝对定位如何在不同分辨率下的电脑正常显示定位位置?(一定要看!)

    这篇文章主要介绍了css绝对定位如何在不同分辨率下的电脑正常显示定位位置,本文首先解释了常见的电脑分辨率,为了页面在不同的分辨率下正常显示,要给页面一个安全宽度,再去使用绝对定位,具体操作步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。

  2. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  3. xcode – 了解iPhone分辨率

    我正在使用phonegap将一个非常简单的html5页面导出到iphone应用程序并遇到这个愚蠢的问题.iPhone分辨率为960×640.当我将画布设置为那些尺寸时,它似乎太大了.这是为什么?我怎样才能利用iphone4的全高清功能.如果我将画布设置为较旧的iPhone,似乎画布适合全屏.将视口设置为这样的东西似乎有效,但是这会是性能损失吗?

  4. ios – 强制iPad Pro无需启动屏幕即可实现全分辨率

    解决方法不,您必须使用启动屏幕来支持iPadPro.这就是Apple决定支持它的方式.如果您找不到使用单个启动屏幕获取所需结果的方法,您可以提供一个特定于iPhone和一个特定的iPad.更新:Xcode8支持iPadProLaunch图像插槽,因此您不再需要使用Launch屏幕文件来支持iPadPro.

  5. 使用Launch Screen.xib模板真正实现通用iOS启动屏幕?

    我没有找到任何有用的教程,如何实际使用它来为所有分辨率使用单个图像制作单个启动屏幕.我知道如何使用约束使UI元素以所有分辨率为中心,但我无法弄清楚如何使我的UIImage缩放在所有分辨率上填充屏幕高度.如果我只调整我的UIImage以填充在模拟指标中选择的当前屏幕尺寸–它将只填充那个,但不适用于其他屏幕尺寸..有人能给我一些线索吗?如何使用此启动屏幕模板使UIImage为所有分辨率填充整个屏幕?

  6. ios – 为什么Google Chrome模拟器以375×667的分辨率显示iPhone 6?

    我正在以编程方式调整我的网站的图像尺寸不同大小的设备.但现在我无法告诉我实际需要什么尺寸.在GoogleChrome模拟器中,我看到我的某些图像有所增加,例如在iPhone6从230×230自然到357×357显示.该图像几乎占据了仿真屏幕的整个宽度,并且看起来稍微退化,这表明iPhone6的宽度不会大于357像素.但是ApplesaysiPhone6的分辨率是750×1334!为什么某些来源的供应尺寸是Chrome模拟器所说的两倍?

  7. 在IOS9中的Cordova应用程序使用JQuery / Javascript的window.history问题

    在两个测试用例中唯一改变的是Cordova.js.解决方法我看到这是几个星期前,但我会发布这个,以防其他人遇到它.听起来它可能与iOS9中的哈希更改生成的导航事件有关.如果是这样,可以将其添加到index.html以禁用哈希侦听:

  8. ios – 如何支持iPhone X分辨率或应用程序的屏幕尺寸?

    在2017年主题演讲和iPhoneX发布之后,我同样担心新iphone的兴奋.这个问题更多是关于用户界面,设计指南或界面设计方法而不是技术问题.我的问题是如何支持1125px×2436px分辨率?一些问题场景:如何支持:>水平图像视图缩放设备的整个宽度和固定高度.>ImageViews缩放整个宽度和高度.>如果我在页面上显示有限的内容,则会有额外的185点高度,这将显示大量空白区域.例如,如何设计高度为400像素并缩放整个宽度的视图.我应该保持顶部对齐的中心垂直对齐吗?

  9. 在开发iOS 7的iPhone应用程序时,还需要使用Interface Builder的低分辨率图像吗?

    我开始为iOS7开发iPhone应用程序.由于iOS7不支持iPhone/iPodtouch的非视网膜显示设备,并且在iPhone模拟模式下使用非视讯内容iPad上的高分辨率图像,现在我认为我们不会在开发仅iPhone应用程序时,需要提供低分辨率图像,其部署目标是iOS7.我以为这很棒,但是当我使用故事板时,我很快遇到了一个问题;显然InterfaceBuilder无法显示高分辨率图像,哪些文件名以@2x结尾.我觉得真的很遗憾,我们必须为InterfaceBuilder提供低分辨率图像…或者如果要使用In

  10. iOS 5上的jQuery事件

    解决方法在Apple开发论坛上由一个人回答:我需要在将元素添加到DOM之后才绑定(),如下所示:

随机推荐

  1. jquery-plugins – 是否可以使用猫头鹰旋转木马实现循环/无限轮播?

    我正在使用猫头鹰旋转木马,它的工作完美,除了它不支持循环/无限滚动.我没有搜索google和stackoverflow的想法,没有运气.有没有人在猫头鹰旋转木马上实现圆形/无限滚动?

  2. jQuery动态输入字段焦点

    我想使用以下jQuery向我的页面动态添加一个输入字段:在这样做之后,我希望输入字段具有闪烁的文本光标的焦点,所以我想在创建后立即输入.有人可以告诉我我该怎么办?

  3. jquery – 为什么$(window).height()这样错了?

    我试图获取当前浏览器的视口高度,使用但我得到的价值观太低了.当视口高度高达850px时,我从height()获取大约350或400像素的值.这是怎么回事?

  4. jquery – 如果在此div之外和其他draggables内部(使用无效和有效的还原选项),则可拖动恢复

    例如这样但是由于明显的原因,这不行.我可以说这个吗?

  5. 创建一个jQueryUI 1.8按钮菜单

    现在jQueryUI1.8已经出来了,我正在浏览更新,并且遇到了新的Buttonwidget,特别是SplitButtonwithadropdown的演示之一.这个演示似乎表明Buttonwidget可以在这里创建一个下拉菜单.作为讨论的问题,我想知道使用这个新的Button小部件来创建一个下拉菜单有什么方法.干杯.解决方法您必须在按钮下方列出一个列表,方式类似于此处为自动完成提供的演示:http

  6. 灰色divs使用JQuery

    我试图使用这个代码:为了淡出一大堆名为MySelectorDiv的div,唯一的是,它只会淡出第一个而不是所有的div,为什么呢?

  7. 使用jQuery动态插入到列表中

    我有两个订单列表在彼此旁边.当我从一个列表中选出一个节点时,我想按照字母顺序插入到另一个列表中.抓住的是我想要把一个元素放在另一个列表中,而不刷新整个列表.奇怪的是,当我插入到右边的列表中,它工作正常,但是当我插入到左边的列表中时,顺序永远不会出来.我也尝试将所有内容读入数组,并将其排序在一起,以防止children()方法没有按照显示顺序返回任何东西,但是我仍然得到相同的结果.这是我的jQuer

  8. 没有回应MediaWiki API使用jQuery

    我试图从维基百科获取一些内容作为JSON:但我没有回应.如果我粘贴到浏览器的地址栏,就像我得到预期的内容.怎么了?解决方法您需要通过添加&callback=?来触发具有$.getJSON()的JSONP行为?在querystring上,像这样:Youcantestithere.没有使用JSONP,你正在击中same-originpolicy,阻止XmlHttpRequest获取任何数据.

  9. jQuery Ajax请求每30秒

    我有这段代码,但是有些人在我的网站上的值可能会改变.我需要每30秒钟更新一次#financediv.这可以做吗解决方法您可以将代码放在单独的函数中,如下所示:然后每30秒建立一个定时器调用该函数:祝你好运!总结以上是DEVMAX为你收集整理的jQueryAjax请求每30秒全部内容。如果觉得DEVMAX网站内容还不错,欢迎将DEVMAX网站推荐给好友。

  10. jquery – keypress事件在IE和Chrome中不工作,但在FF工作

    任何想法为什么会这样发生?我通常认为Chrome会更加宽容代码?这是我的按键键.我错过了什么吗?右图();和leftimage();是应该工作的功能,因为我在其他地方使用这些功能谢谢您的帮助!

返回
顶部