所以我的问题很简单。假设我有一个幻灯片放映运行“淡入淡出”过渡,总共有 10 张图片,我也有典型的下一个/上一个按钮。幻灯片会自动从图像 1 循环到图像 10。如何让用户随时反转播放顺序?例如,在观看图像 6 时,用户单击“上一个”(或必要时单击新按钮),然后返回到图像 5,幻灯片继续显示图像 4、3、2...
这甚至可能吗?我阅读并尝试了 Cycle 中的 'rev' 选项,但我无法让它发挥作用,实际上我不确定它的目的是不是我需要的。
感谢您的任何想法!
所以我的问题很简单。假设我有一个幻灯片放映运行“淡入淡出”过渡,总共有 10 张图片,我也有典型的下一个/上一个按钮。幻灯片会自动从图像 1 循环到图像 10。如何让用户随时反转播放顺序?例如,在观看图像 6 时,用户单击“上一个”(或必要时单击新按钮),然后返回到图像 5,幻灯片继续显示图像 4、3、2...
这甚至可能吗?我阅读并尝试了 Cycle 中的 'rev' 选项,但我无法让它发挥作用,实际上我不确定它的目的是不是我需要的。
感谢您的任何想法!
查看源代码,似乎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