2012-05-15 57 views
0

快速jQuery的週期問題: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的週期揪出過渡。

如果效果方向應該向上或向下,我想立即決定。

  • 如果當前幻燈片是可以說2和5,我點擊頁面導航鏈接到幻燈片1,那麼它應該是'上'。
  • 如果當前幻燈片爲5 2,我在頁面導航點擊鏈接到幻燈片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功能,但在揭露存在,如果d == ...和不知道如何運輸從揭示那些條件scrollvert

回答

0

您可以確定當前顯示該滑塊和哪一個是僅次於uncover過渡使用$.index像下面

$.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; 
}; 

我希望你現在可以弄清楚你想從上面的代碼中得到什麼。或者讓我知道你是否想要。