Flexslider:在自定义按钮单击时移动到下一张幻灯片(有延迟)

Question

我已经使用Flexslider一段时间并且喜欢它,但我有一个自定义功能,我试图实现我有点卡住了.

在每张幻灯片中,我有一些带有2个按钮的文本,基本上是真或假.单击其中一个按钮后,根据用户是否选择了正确的答案进行动画处理.不管他们选择什么,经过几秒钟的短暂延迟后,我希望幻灯片能够动画到下一张幻灯片.

我的flexslider调用如下所示:

$(window).load(function () {
$('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    slideshow: false,
    controlNav: false,
    touch: true,
    smoothHeight: true
});
});

我设法创建了一些javascript,以便在单击按钮时移动到第二张幻灯片:

$('.true-or-false .btn').click(function () {
$('.slider').flexslider(0);
});

但是,为每一个按钮执行此操作会很痛苦,我试图找到一个"下一个"功能但却无法正常工作.除此之外,我试图添加.delay(2000)但是上面的代码看起来似乎不太好.

我认为flexslider中的幻灯片有延迟功能,我只需要找到一种方法,使用自定义按钮移动到下一张幻灯片.任何人都可以对此有所了解吗？

感谢您抽时间阅读!STE

*编辑*

出于某种原因,当我第一次尝试下面的代码时,它没有用,但现在添加'next'会使幻灯片在点击按钮时动画到下一个 - 现在我只需要延迟!

$('.true-or-false .btn').click(function () {
$('.slider').flexslider('next');
});

Answer 1

看起来我已经设法让这个工作,并认为在这里发布我的解决方案可能是有用的,因为任何人都应该寻求与Flexslider实现类似的功能.这是我想出的:

$('.true-or-false .btn').click(function () {
setTimeout(
    function()
    {
        $('.flexslider').flexslider('next')
    }
    , 2000);
});

在点击Flexslider中的(自定义)按钮时,当您可以指定时,它将移动到下一张幻灯片,但不会延迟到延迟之前.

只是一个快速的说明.我想要实现这种效果的原因是因为当你点击一个按钮(无论是真还是假)时,在移动到下一个问题之前,动画就会告诉用户他们是否正确.

希望这有助于别人:)