Jqueryローラー/トグル効果

Question

jquery（理想的にはプラグインを使用しています）でローラートグルを探しています。次のHTMLがある場合：

<ul> 
    <li>Option 1</li> 
    <li>Option 2</li> 
    <li>Option 3</li> 
</ul> 

私は最初のオプションを表示し、他のものは非表示にします。オプションをタップ/クリックするたびに、次のループが表示され、最後のループ後の最初のループまで周りにループします。モバイルウェブ端末で使用すると、上下のスワイプに反応し、「ローラー」のように表示されます（スライドの上/下の効果を使用します）。あまりにも多くの質問？うまくいけば、どんなポインタも高く評価されています。

おかげで、

ポール

Answer 1

は、あなたがあなた自身のプラグイン

を書きたい場合には、原理で動作を始めるには少しサンプルですマークアップ

<ul id="test"> 
    <li>Option 1</li> 
    <li>Option 2</li> 
    <li>Option 3</li> 
</ul> 

のこの種のその後これはプラグインのコードである（かなり基本的な、しかし、拡張することができます）

(function($) { 
    $.fn.roller = function(){ 

     this.children(':not(:first)').hide(); 

     this.children().click(function(){ 
      if($(this).next().length>0){ 
       $(this).hide().next().show(); 
      } 
      else{ 
       $(this).hide().parent().children(':first').show(); 
      } 
     }); 
    }; 
})(jQuery); 

このアイデアに取り組んでいます10

：任意の要素をクリック

1）すべてが、最初の子 2を非表示にする）は、その要素を隠し、クリックされた要素がその中に、子どもたちのリストの最後でない限り（次を示してい最初の項目が表示されている場合）。

が最後にプラグインは、このコードを使用してインスタンス化されます。

$('#test').roller(); 

jsFiddle：http://jsfiddle.net/jamiec/zpq3u/

Answer 2

私は、あなたが探しているコントロールは、一般的にアコーディオンと呼ばれているものだと思います。 jQueryのUIで1あり

：http://jqueryui.com/demos/accordion/

スワイプアクションなどの特別なもののためには、私はあなたが自分でキャッチし、それらをどのように処理するかを決定する必要があるだろうと思います。 jQueryのUIのアコーディオンはそうのような特定の「タブ」を表示するように指示することができます：ここで

$('#my-ul').accordion('activate', tabIndex);