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 回答