it_proger29
@it_proger29
Битрикс

Swiper JS, как заблокировать скрол при наведении на блок?

var methods = {
            'init':function(){
                this.initSwiperMain();
                this.initSwiperExt();
                this.initYandexMap();
            },
            
            'initSwiperMain':function(){
                if (appConfig.mobileVersion) { return false; }  




                params.swipers.swiperMain = $thisNodes.swiperMain.swiper({
                    speed: 500,
                    loop: false,
                    direction: 'vertical',
                    onlyExternal: true,
                    roundLengths: true,
                    preventClicks: false,
                    mousewheelControl: true,
                    simulateTouch: false,
                    pagination: $('.is-tech-pager')[0],
                    paginationClickable: true,
                    paginationBulletRender: function (sw, index) {
                        var thisTitle = sw.slides[index].dataset.title || "";
                        return '<div class="swiper-pagination-bullet"><div class="spb-label"><span>' + thisTitle + '</span></div></div>';
                    },
                    onSlideChangeStart:function(sw){
                        if(sw.activeIndex>0) {
                            conf.nodeBody.addClass('body-state-technology-second');
                        } else {
                            conf.nodeBody.removeClass('body-state-technology-second');
                        }
                    }
                });
}

Это сам слайдер.

При наведении на блок с классом .l-col-map нужно отключить скрол. А когда отводишь курсор с этого блока, .l-col-map , включить скрол.

Весь день просидел, так ничего и не получилось. Испробовал кучу методов, все что было в документации...

Это то, что имею на данный момент.
$('.l-col-map').on('mouseenter', function (e) {
	params.swipers.swiperMain = $thisNodes.swiperMain.swiper({
                    speed: 500,
                    loop: false,
                    direction: 'vertical',
                    onlyExternal: false,
                    roundLengths: false,
                    preventClicks: false,
					noSwiping: true,
                    mousewheelControl: false,
                });
 })
 $('.swiper-container').on('mouseenter', function (e) {
	 params.swipers.swiperMain = $thisNodes.swiperMain.swiper({
                    speed: 500,
                    loop: false,
                    direction: 'vertical',
                    onlyExternal: true,
					noSwiping: false,
                    roundLengths: true,
                    preventClicks: false,
                    mousewheelControl: true,
                });
 })
  • Вопрос задан
  • 694 просмотра
Решения вопроса 1
Insanus
@Insanus
swiper.mousewheel.disable ()
Отключить управление колесиком мыши

swiper.mousewheel.enable ()
Включить управление колесиком мыши

ну и сам пример событий
map.addEventListener('mouseenter', () => pageSlider.mousewheel.disable());
map.addEventListener('mouseleave', () => pageSlider.mousewheel.enable());
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы