Отключить прокрутку по клику в карусели MaterializeCSS

Question

У меня есть карусель materializecss, которая отображает 3 предмета одновременно. Если пользователь нажимает на элемент, который в данный момент не находится в центре, прокручивается карусель. Я хочу, чтобы пользователь мог взаимодействовать с элементом, не прокручивая его в центр. Как отключить прокрутку по центру?

<ul class="carousel">
            <li class="carousel-item"><div class="scenario-item card-panel hoverable">
    <button class="close-button btn-flat">X</button>Item 1
</div></li>
            <li class="carousel-item">Item 2</li>
            <li class="carousel-item">Item 3</li>
            <li class="carousel-item">Item 4</li>
            <li class="carousel-item">Item 5</li>
            <li class="carousel-item">Item 6</li>
            <li class="carousel-item">Item 7</li>
        </ul>
        <button id="next">Next</button>

<script>
        $(document).ready(function(){
            $('.carousel').carousel({ dist: 0, indicators: true, noWrap: true });
            var instance = M.Carousel.getInstance($('.carousel')[0]);

            $('#next').on('click', function () {
                var instance = M.Carousel.getInstance($('.carousel')[0]);
                instance.next();
            });
        });
</script>