Flexslider：单击自定义按钮时移至下一张幻灯片（有延迟）答案

【问题标题】：Flexslider: move to next slide (with a delay) on custom button clickFlexslider：单击自定义按钮时移至下一张幻灯片（有延迟）
【发布时间】：2014-09-11 17:55:10
【问题描述】：

我使用 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 中的幻灯片会有延迟功能，我只需要找到一种使用自定义按钮移动到下一张幻灯片的方法。任何人都可以对此有所了解吗？

感谢您抽出宝贵时间阅读本文！步骤

* 编辑 *

由于某种原因，当我第一次尝试下面的代码时它不起作用，但现在添加“下一个”确实会使幻灯片在单击按钮时动画到下一个 - 现在我只需要延迟！

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

【问题讨论】：

标签： javascript jquery flexslider

【解决方案1】：

看起来我已经设法让它工作，并认为在这里发布我的解决方案可能会很有用，以防任何人都应该寻求使用 Flexslider 实现类似的功能。这是我想出的：

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

当您在 Flexslider 中单击（自定义）按钮时，将移动到下一张幻灯片，但不会在延迟之前移动到您可以指定的时间。

只是一个简短的说明。我想要实现这种效果的原因是，当您单击一个按钮（真或假）时，会出现一个动画，告诉用户他们是否正确，然后再转到下一个问题。

希望这对其他人有帮助:)

【讨论】：