如何解决如何在窗口调整大小时删除/重新加载机车滚动?
我正在构建一个网站,该网站在桌面上使用水平布局,并在较小的屏幕上切换回原生垂直布局。我正在使用机车滚动,效果很好,但我似乎无法调整窗口大小。
这里是大屏幕的功能
const lscroll = new LocomotiveScroll({
el: document.querySelector('[data-scroll-container]'),smooth: true,direction: 'horizontal'
});
并且在 window.resize 事件中,如果宽度低于移动阈值,我尝试销毁它并再次调用它,但方向为“垂直”而不是“水平”。
const lscroll = new LocomotiveScroll({
el: document.querySelector('[data-scroll-container]'),direction: 'vertical'
});
lscroll.destroy();
lscroll.init();
有什么想法吗?
解决方法
我从未使用过 LocomotiveScroll,但您提供的示例代码很奇怪。
您将垂直 LS 分配给 lscroll
,然后销毁它(垂直 LS),然后再次初始化。
您可能想要使用以下内容:
let lscroll = new LocomotiveScroll(...);
const handleResize = () => {
const desiredType = ... // 'horizontal' or 'vertical'
if (lscroll.direction !=== desiredType) {
lscroll.destroy()
lscroll = new LocomotiveScroll(...);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。