Swiper：仅用一个按钮和以前的项目手动滑动到下一个项目

我正在使用swiper来显示一些项目。Swiper：仅用一个按钮和以前的项目手动滑动到下一个项目

我只想在单击按钮时滑动到下一个项目，但要手动滑动到之前的项目。

这些都是关系到刷卡的相关选项：

allowSwipeToPrev：设置为false以禁用刷卡之前的滑动方向（向左或顶部）

allowSwipeToNext：设置为false禁用向下滑动方向滑动（向右或向下）

swipeHandler：CSS with CSS选民或者分页容器的HTML元素，将作为仅可处理工作进行刷卡

Next按钮：用CSS选择器或元素的HTML元素的字符串，将点击后的工作就像“下一步”按钮就可以了

prevButton：用CSS选择器或元素的HTML元素的字符串，将点击后工作像“上一页”按钮就可以了

如果我使用swipeHandler为TH e按钮选择器，它按预期工作，但我无法滑动到上一个项目，因为它作为只有可供用于滑动的处理器。无论我使用什么其他选项。

如果我设置allowSwipeToNext为false，并使用nextButton代替swipeHandler，也不会滑动到下一个项目，甚至当我点击下一个按钮。

所以问题是：我该如何才能实现仅用手指轻轻一按即可滑动到下一个项目，以及只能手动轻松移动到以前的项目？

来源

2016-11-17 Manolo

对不起，如果你禁用swipeToNext，你不能滑动到下一个似乎逻辑。我不明白这个问题。 –

@MarcosPérezGude：好吧，我只是想禁用**手动**滑动到下一个，但保持滑动到下一个按钮，并手动刷到prev。 – Manolo

有同样的问题，解决这样的：

var swiper = new Swiper('.swiper-container', { 
    nextButton: '.swiper-button-next', 
    prevButton: '.swiper-button-prev', 
    spaceBetween: 30, 
}); 
// Locks the swipe to next by default 
swiper.lockSwipeToNext(); 

$("#button_id").click(function(e){ 
    e.preventDefault(); 
    // Unlocks the swipe to next when the button is clicked 
    swiper.unlockSwipeToNext(); 
    // Swipes to the next slide 
    swiper.slideNext(); 
    // Locks the swipe to next again after moving to the next slide 
    swiper.lockSwipeToNext(); 
});

我希望它可以帮助你！

来源

2017-08-05 14:54:53

Swiper：仅用一个按钮和以前的项目手动滑动到下一个项目

回答

相关问题