目标是根据浏览器宽度禁用或启用滑块功能。
我的代码在窗口从大到小/从小到大调整大小的前几次完美运行,但是当窗口> = 1200并且控制台显示“TypeError:this.listeners is undefined”时,它停止禁用滑块滑翔。摧毁
我花了几个小时在谷歌上搜索这些错误,但仍然无法弄清楚。我对 jQuery 完全陌生,并且在使用它时遇到了很大的困难。
var id;
var isMounted = false;
var glide = new Glide("#intro", {
type: "carousel",
gap: "12",
perView: 5,
focusAt: "center",
breakpoints: {
800: {
perView: 2
},
480: {
perView: 1
}
}
});
if (jQuery(window).width() < 1200) {
glide.mount();
isMounted = true;
}
jQuery(window).resize(function() {
clearTimeout(id);
id = setTimeout(doneResizing, 500);
});
function doneResizing() {
if (isMounted === true) {
if (jQuery(window).width() >= 1200) {
glide.destroy();
isMounted = false;
console.log("destroy false");
}
}
if (isMounted === false) {
if (jQuery(window).width() < 1200) {
glide.mount();
isMounted = true;
}
console.log("mount true");
}
}
查看我的浏览器控制台,似乎在某些时候glide.mount()
立即开始运行glide.destroy
,我不知道为什么。这是我所看到的(出于隐私原因,网站名称已编辑):
JQMIGRATE:已安装 Migrate,版本 1.4.1 jquery-migrate.min.js:2:552
安装真正的 glide-custom-test-03.js:44:34
will-change 内存消耗太高。预算限制是文档表面积乘以 3(289296 像素)。超出预算的意愿变化将被忽略。
销毁错误的 glide-custom-test-03.js:38:36
安装真正的 glide-custom-test-03.js:44:34
TypeError: this.listeners is undefinedglide.min.js:6:5987
值-/wp-content/themes/mytheme/js/slider/glide/dist/glide.min.js?ver=1.1:6
取消绑定-/wp-content/themes/mytheme/js/slider/glide/dist/glide.min.js?ver=1.1:6
调整大小 -/wp-content/themes/mytheme/js/slider/glide/dist/glide.min.js?ver=1.1:6
值-/wp-content/themes/mytheme/js/slider/glide/dist/glide.min.js?ver=1.1:6
forEach 自托管:262
值-/wp-content/themes/apt2c/js/slider/glide/dist/glide.min.js?ver=1.1:6
值-/wp-content/themes/apt2c/js/slider/glide/dist/glide.min.js?ver=1.1:6
doneResizing -/wp-content/themes/apt2c/js/slider/glide/custom/glide-custom-test-03.js?ver=1.1:37