Owl Carousel 2 带有 mousewheel.js 和无循环

问题描述

我将 Owl Carousel 2 与 mousewheel.js 一起使用，它运行良好。 我还设法使其工作设置循环：false

当我滚动到最后一张或第一张幻灯片时，我的问题出现了：我的鼠标停止工作并且我无法滚动页面，除非我的鼠标在轮播空间之外。当我转到第一张或最后一张幻灯片时，如何让鼠标像往常一样在页面上滚动？ 每次到轮播结束或开始时，我是否应该分离并重新附加鼠标滚轮事件侦听器？

这是我目前的代码：

           let owl = document.getElementsByClassName('owl-stage'),nestedChildren = $(this).find('.owl-item').length;

            owl[0].addEventListener('mousewheel',e => {
                var activeSlideIndex= $(this).find('.owl-item.active').index() + 1;
                
                if (e.deltaY > 0 && nestedChildren > activeSlideIndex) {
                    $('.owl-carousel').trigger('next.owl',[0,300]);
                } else if (e.deltaY < 0 && nestedChildren > activeSlideIndex) {
                    $('.owl-carousel').trigger('prev.owl',300]);
                }
                e.preventDefault();
            },false);

解决方法

在执行 if else 语句之前，检查您是否在第一张/最后一张幻灯片上，以及滚动方向是否试图滚动出轮播。如果是这样，请退出 eventListener 并使滚轮正常运行。否则，继续使用现有的 if else 语句。