Как синхронизировать два слайдера с колесиком мыши?

Question

Я использую слайдер Swiper на своей странице.И на моей странице у меня есть два ползунка.Я хочу, когда я использую прокрутку вверх - первый слайдер идет вверх, а второй слайдер идет вниз.И когда я использую прокрутку вниз - первый слайдер идет вниз, а второй слайдер идет вверх.

Я пишу это

https://288757.playcode.io https://playcode.io/288757?tabs=style.css&output, но этот код не подходит, потому что работает странно на Mac и не работает на Firefox, и потому что я не использую параметр swiper для колесика мыши.

        $(window).bind('mousewheel', function(event){
            var width = $(document).width();

            if(width >= 769){
                if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
                    mySwiper1.slideNext(600);
                    mySwiper2.slidePrev(600);
                }
                else {
                    mySwiper1.slidePrev(600);
                    mySwiper2.slideNext(600);
                }
            }
        });

Это мои ползунки без этого кода https://jsfiddle.net/gpkd83nr/2/

Какможно синхронизировать два ползунка с колесиком мыши?Спасибо!

Answer 1

ты можешь попробовать это?

window.onwheel=function(e){
            var val=e.deltaY;
        if(val>0){
         mySwiper1.slideNext(600);
         mySwiper2.slidePrev(600);
             }
        else{
           mySwiper1.slidePrev(600);
           mySwiper2.slideNext(600);
        }
    }