为什么 GlideJS 在 IE11 中不设置事件监听器?

我已经使用 Glide.js 实现了 2 个滑块,它们在 Chrome 和 FireFx 中运行良好。

我已经尝试在 IE11 和 Edge 中实现它,但都不会向 DOM 元素添加事件,因此滑块都不起作用。

此外,在某些宽度下,我想让超过 1 张幻灯片出现在屏幕上,而 glide 不想调整幻灯片的大小,以便它们可以按预期的方式进行调整。

我的问题是:

  1. 为什么事件不附加(绑定/添加,我不太确定在 glide js 中事件发生什么类型的操作)到 DOM 元素?

  2. 为什么样式会因为我所做的断点而变得疯狂,所以出现的幻灯片不超过 1 张?

GlideJS github 假定它在 edge 和 IE11 上都运行良好,那么我哪里错了?

代码:通过module导入,然后在webpack中通过babel编译

const tech_section_glide = new Glide('#tech_stack_section_slider', {

    type: 'slider',

    perView: 4,

    animationDuration: 500,

    gap: 10,

    breakpoints: {

        449: {

            perView: 1

        },


        705: {

            perView: 2,

        },

        1024: {

            perView: 3

        }

    }

});


const portfolio_glide = new Glide('#portfolio_slider', {

    type: 'slider',

    perView: 1,

    animationDuration: 300

});


tech_section_glide.mount();

portfolio_glide.mount();

这是它在 Chrome 中的外观: Chrome 视图

这是它在 IE11 中的样子:

IE11_view


梵蒂冈之花
浏览 66回答 1
1回答

繁星淼淼

知道了!问题不在 GlideJS 本身,而是在我所做的糟糕的 babel 配置中,所以如果你想在 IE11 中运行 ES6 标准,你应该进行适当的 babel 配置并安装所需的 Polyfills。这是 IE11 的 webpack+babel 配置指南的链接:https ://medium.com/@ramez.aijaz/transpile-typescript-to-es5-using-babel-and-webpack-f3b72a157399
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript