如果将窗口调整为较大的分辨率,则销毁iDangerous Swiper;如果将窗口调整为较小的分辨率,则调用iDangerous Swiper [英] destroy iDangerous Swiper if window is resized to a bigger resolution or call it when resized to a smaller resolution
问题描述
我在较低分辨率下将 iDangerous Swiper 用于我的网站.这是我的称呼方式:
i'm using iDangerous Swiper for my website in lower resolutions. here is how i'm calling it:
var resolution = 670;
if ($(window).width() < resolution) {
var mySwiper = $('.swiper-container').swiper({
mode:'horizontal',
loop: true,
grabCursor: true,
paginationClickable: true
});
因此,当您在桌面浏览器中访问它时,将不会调用该滑动器.我想做的是,如果用户将窗口的大小调整为小于resolution
的大小,则打开它";如果用户以较小的窗口大小访问它,然后将其调整为大于resolution
的大小,则销毁它.我试过了,但是没用:
so, when you access it in a desktop browser, the swiper will not be called. what i want to do is to "turn it on" if the user resizes the window to a size smaller than resolution
or destroy it if the user accesses it in a small window size and then resizes it to bigger than resolution
. i tried this, but it didn't work:
$(window).resize(function(){
if ($(window).width() < resolution) {
if(typeof(mySwiper) === "undefined" ) {
var mySwiper = $('.swiper-container').swiper({
mode:'horizontal',
loop: true,
grabCursor: true,
paginationClickable: true
});
}
} else {
if (typeof(mySwiper) !== "undefined" ) {
mySwiper.destroy();
}
}
});
发生了两种不良情况:
- 如果用户的分辨率较小,并且将其调整为仍可称为滑动键的分辨率,则会重新启动滑动键.
- 如果用户使用较小的分辨率,然后将其调整为较大的分辨率,则不会被破坏.
我的问题是typeof
.我不太了解变量被这样调用时的工作方式:$('.swiper-container').swiper()
.
i thing my problem is the typeof
. i don't know much how variables work when they are called like this: $('.swiper-container').swiper()
.
我如何取消呼叫" swiper?如果已经被呼叫,如何不调用它?
how do i "uncall" swiper and how not call it if it was already called?
推荐答案
我的解决方案:
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();
});
它很烦! :)
这篇关于如果将窗口调整为较大的分辨率,则销毁iDangerous Swiper;如果将窗口调整为较小的分辨率,则调用iDangerous Swiper的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!