0

快速jQuery循环问题：

$.fn.cycle.transitions.uncover = function($cont, $slides, opts) {
    var d = opts.direction || 'left';
    var w = $cont.css('overflow','hidden').width();
    var h = $cont.height();
    opts.before.push(function(curr, next, opts) {
        $.fn.cycle.commonReset(curr,next,opts,true,true,true);
        if (d == 'right')
            opts.animOut.left = w;
        else if (d == 'up')
            opts.animOut.top = -h;
        else if (d == 'down')
            opts.animOut.top = h;
        else
            opts.animOut.left = -w;
    });
    opts.animIn.left = 0;
    opts.animIn.top = 0;
    opts.cssBefore.top = 0;
    opts.cssBefore.left = 0;
};

这是 jQuery 循环发现过渡。

我想即时决定效果方向是向上还是向下。

  • 如果当前幻灯片是 5 张中的 2 张，并且我单击链接到幻灯片 1 的页面导航，那么它应该是“向上”。
  • 如果当前幻灯片是 2 of 5 并且我单击链接到幻灯片 5 的页面导航，则方向应该是“向下”

从逻辑部分来看，这似乎是通过一个简单的“if”语句来完成的，但我已经尝试过并且无法真正完成工作。

任何提示将不胜感激！

还有一件事：我知道有类似 scrollVert 的东西——但它不能满足我的需求。我需要以两种方式（上/下）几乎就像 scrollVert 一样工作，但不完全以同样的方式。

另外，scrollVert 是：

$.fn.cycle.transitions.scrollVert = function($cont, $slides, opts) {
    $cont.css('overflow','hidden');
    opts.before.push(function(curr, next, opts, fwd) {
        if (opts.rev)
            fwd = !fwd;
        $.fn.cycle.commonReset(curr,next,opts);
        opts.cssBefore.top = fwd ? (1-next.cycleH) : (next.cycleH-1);
        opts.animOut.top = fwd ? curr.cycleH : -curr.cycleH;
    });
    opts.cssFirst.top = 0;
    opts.cssBefore.left = 0;
    opts.animIn.top = 0;
    opts.animOut.left = 0;
};

我试图更改 scrollvert 功能，但在发现中有一个 if d == ... 并且不知道如何将该条件从发现传输到 scrollvert

4

1 回答 1

0

您可以使用$.index在uncover转换中确定当前正在显示哪张幻灯片以及下一张是哪张幻灯片，如下所示

$.fn.cycle.transitions.uncover = function($cont, $slides, opts) {
    var d = opts.direction || 'left';
    var w = $cont.css('overflow','hidden').width();
    var h = $cont.height();
    opts.before.push(function(curr, next, opts) {
        $.fn.cycle.commonReset(curr,next,opts,true,true,true);
        // find index of Current slide
        var curIndex = $slides.index(curr) + 1;// as it's 0 based
        // find index of Next Slide 
        var nextIndex = $slides.index(next) + 1;
        // now set d based on this two values
        if(curIndex == 2 && nextIndex == 1)
           d = 'up';
        if(curIndex == 2 && nextIndex == 5)
           d = 'down';
        // add as many condition as you want
        if (d == 'right')
            opts.animOut.left = w;
        else if (d == 'up')
            opts.animOut.top = -h;
        else if (d == 'down')
            opts.animOut.top = h;
        else
            opts.animOut.left = -w;
    });
    opts.animIn.left = 0;
    opts.animIn.top = 0;
    opts.cssBefore.top = 0;
    opts.cssBefore.left = 0;
};

我希望你现在可以从上面的代码中弄清楚你想要什么。或者让我知道您是否愿意。

于 2012-05-15T13:13:56.580 回答