jquery旋轉木馬 - 沒有插件

我想旋轉我的div與next和prev按鈕。我知道有插件等可用，但我想自己做，只是我不太確定如何。jquery旋轉木馬 - 沒有插件

因此，這裏的HTML標記，我至今

<div class="prev-btn"></div> 
<div class="row"> <!-- content in here --></div> 
<div class="row"> <!-- content in here --></div> 
<div class="row"> <!-- content in here --></div> 
<div class="next-btn"></div>

我想要做的是顯示1行的時間，當我點擊上/下一個按鈕，顯示不同的DIV 。當我在最後一行時，下一行將再次顯示第一行。

我知道如何做onclick事件和切換div。但我真的不知道如何確定我在哪一行以及如何選擇下一個顯示。

如何讓我的下一個/上一頁按鈕正常工作？

來源

2013-04-01 Becs Carter

你想自己做，但你問我們該怎麼做。您可以使用應用於活動幻燈片的活動課程跟蹤哪一個活動。你可以通過使用jQuery .next（）和.prev（）方法來獲得下一個或prev。 –

只是你如何能做到這一點的想法..

var $rotator = $(".container"); 
$rotator.find("div .row:gt(0)").hide();

得到的div要顯示在列表中

var $current = $rotator.find("div .row:visible"); 
var $next = $current.next();

現在在旁邊做單擊下一步DIV，

if ($next.length == 0) 
    $next = $rotator.find("div .row:eq(0)"); 

$current.hide(); 
$next.show();

同樣，您可以使用.prev()獲得以前的兄弟分區。

這是一個簡單的Demo

來源

2013-04-01 22:03:33

jquery旋轉木馬 - 沒有插件

回答

相關問題