jquery的周期幻灯片 - 用自定义动画

我使用与自定义动画jquery的周期插件沿加入滑动上/下一个进展（一拉scrollHorz）。它工作得很好！jquery的周期幻灯片 - 用自定义动画

然而，我想的幻灯片前进到右侧或左侧，这取决于索引＃，即，如果用户点击链接1，而滑动＃3是活动幻灯片的动画将转移出到右侧，而如果在幻灯片上单击链接4将转换到左侧。

我要找的功能是一样的scrollHorz/scrollVert过渡。

我知道我需要的是将当前帧和下一帧关联起来的逻辑：if（frameclicked是比当前幻灯片更高的索引）{动画向左} else {动画向右}

我只是不知道把它放在代码中。我希望这是有道理的。任何帮助将不胜感激！谢谢！

不，它可能会有所帮助，但我的自定义代码如下。

$('#s4').before('<div id="nav" class="nav">').cycle({ 
    fx:  'custom', 

    cssBefore:{ 
      left:1000, 
      opacity:0, 
      display:'block' 
     }, 
    animIn:{ 
      left:0, 
      opacity:100 
     }, 
    animOut:{ 
      left:-1000, 
      opacity:0 
     }, 
    cssAfter:{ 
      display:'none' 
     }, 
    speed: 'slow', 
    easeIn: 'easeInExpo', 
    easeOut: 'easeInExpo', 
    next: '.nextnav', 
    prev: '.previous', 
    timeout: 0, 
    containerResize: 1, 
    fit: 0, 
    height: 600, 
    pager: '#slideshow-nav', 
    pagerAnchorBuilder: function(idx, slide) { 
      return '#slideshow-nav li:eq(' + (idx) + ')'; 
     } 

});

来源

2011-04-17 Jackrabbitrocks

你需要挂接到到onPrevNextEvent。他们有一些东西叫isnext至于通过这基本上告诉你你要进入哪个方向。

例子我更新了一个小提琴，我昨天鞭打了周期。

http://jsfiddle.net/gx3YE/12/

$(function() { 

$('#megaWrapper').cycle({ 
    next : "#next", 
    prev : "#prev", 
    timeout : 0, 
    onPrevNextEvent: function(is,i,el) { 
     if (is === true) { 
      alert('slide right'); 
     } 
     else { 
      alert('slide left'); 
     } 
    } 

});

}）;

来源

2011-04-18 04:31:30 wesbos

非常感谢你的帮助！我真的很感激你花时间看这个。这无疑是朝着正确方向迈出的一步。我仍然需要了解如何从条件语句中访问动画功能 - 或者使用条件语言中的信息。那么，我是否会用上述示例中的alert函数替换动画？或者我可以传递一个变量给aniIn/aniOut？恐怕我还不清楚它的外观。 – Jackrabbitrocks 2011-04-19 18:44:18

另外，onPrevNextEvent可以用于自动生成的传呼机链接还是仅用于p/n按钮？我真的希望在这个插件上有一些文档。考虑到这个问题已经持续了很长时间，我感到很惊讶。 – Jackrabbitrocks 2011-04-19 18:49:46

是不是你所描述的循环的核心功能部分是什么？

这里是我如何做到这一点：

$('.slideshow').cycle({ 
    fx: 'scrollHorz', 
    timeout: 0, 
    next: '#next', 
    prev: '#prev'  
});

来源

2011-06-15 17:07:20 Doron

嗯，我看到她的努力做，我有同样的问题... 我使用scrollHorz没有问题......我所有的时间..我工作的项目需要当前幻灯片滑到屏幕（左或右），但也有淡出的是退出幻灯片效果... 的“onPrevNextEvent”似乎近乎完美..的animOut，animIn的伟大工程太..但我不能设置一个向左或向右outro其中任何一个..只是一个方向.... :( 任何想法的人？ – Abbey 2013-07-23 01:12:33

jquery的周期幻灯片 - 用自定义动画

回答

相关问题