Question

看起来之前没有人问这个问题，因为我几乎在互联网上寻找一个非常简单的答案。

如何禁用在物化大小旋转木马上左/右滑动的功能？

Answer 1

在Materialize.js中添加/编辑：

var allowCarouselDrag = true;
value: function _handleCarouselDrag(e) {
    if(allowCarouselDrag){
       ....
    }
}

您可以为每个应用程序设置allowCarouselDrag变量。

Answer 2

我这样解决了

// Create carouser
$('#carousel').carousel({
            fullWidth: true,
            indicators: false,
            duration: 100,
        });

// Get instance of carousel
carouselInstance = M.Carousel.getInstance(sliderDOM);

// Remove event listeners added by Materialize for corousel
document.getElementById("carousel").removeEventListener('mousedown', carouselInstance._handleCarouselTapBound);
document.getElementById("carousel").removeEventListener('mousemove', carouselInstance._handleCarouselDragBound);
document.getElementById("carousel").removeEventListener('mouseup', carouselInstance._handleCarouselReleaseBound);
document.getElementById("carousel").removeEventListener('mouseleave', carouselInstance._handleCarouselReleaseBound);
document.getElementById("carousel").removeEventListener('click', carouselInstance._handleCarouselClickBound);

在禁用拖动/滑动之后，您仍然可以通过以下方式更改页面/项目

carouselInstance.set(0);

和

carouselInstance.next(0);

Answer 3

这远不是一个完美的解决方案，它可能会在你的情况下禁用太多的功能，我不确定。打开/关闭此选项的选项将非常受欢迎。

但是根据我的需要，关闭旋转木马上的活动就完成了这项工作：

var carousel = $('.carousel.carousel-slider').carousel();
// Disable all swipping on carousel
if (typeof window.ontouchstart !== 'undefined') {
    carousel.off('touchstart.carousel');
}
carousel.off('mousedown.carousel');

Answer 4

function tap(e) {

    pressed = true;
    dragged = false;
    vertical_dragged = true;
    reference = xpos(e);
    referenceY = ypos(e);

    velocity = amplitude = 0;
    frame = offset;
    timestamp = Date.now();
    clearInterval(ticker);
    ticker = setInterval(track, 100);
}

Answer 5

过去三天，我一直试图解决这个问题，并且得出的结论是，除了像Lester的回答一样直接编辑materialize.js文件之外，没有其他解决方案。不幸的是，这不是理想的解决方案，因为它在更新Materialize等时会引起问题。
在这段时间之后，我想到的最简单的解决方案是以下javascript：

window.onload = function() {    
    window.mouseDownNow = false;
    // The selector below must be more specific than .carousel.carousel-slider in
    // order for the event to be cancelled properly.
    $('.class-added-to-block-swiping-functionality')
    .mousedown(function() {
        window.mouseDownNow = true;
    })
    .mousemove(function(event) {
        if(window.mouseDownNow) {
            event.stopPropagation();
        }
    })
    .mouseup(function() {
        window.mouseDownNow = false;
    });
};

这将仅使事件停止冒泡至Materialize滑动功能。
注意：我不确定选择器的具体程度，我是针对文本区域的类。

禁用触摸物化轮播

5 个答案: