1

所以我的问题很简单。假设我有一个幻灯片放映运行“淡入​​淡出”过渡，总共有 10 张图片，我也有典型的下一个/上一个按钮。幻灯片会自动从图像 1 循环到图像 10。如何让用户随时反转播放顺序？例如，在观看图像 6 时，用户单击“上一个”（或必要时单击新按钮），然后返回到图像 5，幻灯片继续显示图像 4、3、2...

这甚至可能吗？我阅读并尝试了 Cycle 中的 'rev' 选项，但我无法让它发挥作用，实际上我不确定它的目的是不是我需要的。

感谢您的任何想法！

4

1 回答 1

2

查看源代码，似乎rev选项仅适用于动画，不适用于淡入淡出。这是确切的评论：

// causes animations to transition in reverse (for effects that support it such as scrollHorz/scrollVert/shuffle)

您可能正在向后寻找：

// true to start slideshow at last slide and move backwards through the stack

当您想反转顺序时，请尝试将其设置为 true。

编辑：可能有更好的方法来做到这一点。无论如何，这是一种方法。首先，向您的按钮添加一个调用某些函数的单击处理程序：

function toggleDirection(){
    // replace your_slide_div with whatever your div is named
    $('.your_slide_div').cycle("toggleDirection");
}

然后在循环插件JS文件中，查找handleArguments(cont, options, arg2)函数。在 switch 语句中，添加一个 case：

case "toggleDirection":
        $(cont).data('cycle.opts').backwards = $(cont).data('cycle.opts').backwards ? false : true;
        if($(cont).data('cycle.opts').backwards)
            $(cont).data('cycle.opts').nextSlide = 
                $(cont).data('cycle.opts').nextSlide - 2 < 0 ? 
                $(cont).children().length - 1 : $(cont).data('cycle.opts').nextSlide - 2;
        else
            $(cont).data('cycle.opts').nextSlide = 
                $(cont).data('cycle.opts').nextSlide + 2 >= $(cont).children().length ? 
                0 : $(cont).data('cycle.opts').nextSlide + 2;
        return false;

编辑：这种情况假设您正在浏览所有图像。如果您使用的是slideExpr选项，那么这将导致问题。

请注意，这会切换方向，因此单击按钮两次会使其恢复正常，如果您只想让它反转，请将大小写更改为：

(cont).data('cycle.opts').backwards = true;

编辑：希望最后一个。在插件 JS 文件中，搜索以下内容：

opts.nextSlide < opts.currSlide

将该特定选择替换为：

opts.currSlide == els.length - 1
于 2011-02-21T19:54:34.133 回答