jQuery Mobile：ページ遷移で消えない静的なナビゲーションが可能ですか？

Question

jQuery Mobileでは、左に.ui-content divとは別に200px（または割合）を占めるナビゲーションバーを持つことができますか？これは、コンテンツがスワイプ（トランジション）によって変更されると、ナビゲーションが左に静的に留まることを意味します。

これを設定するにはどうすればよいですか？コンテンツビューの編集や、特定のコンテンツのページ遷移を避ける方法についてのドキュメントは見つかりません。

私のサンプルコードの問題は、hrefのリンクはどこにもリンクしていないということです。彼らは単に動作しません。私がそれらをdata-role = "page"の中に入れると、それは動作します。

 <div id="nav"> 
      <ul> 
       <li><a href="#one">One</a></li> 
       <li><a href="#two">Two</a></li> 
       <li><a href="#three">Three</a></li> 
      </ul> 
     </div> 

     <div data-role="page" id="one" data-transition="slide"> 
      <div data-role="content" style="background-color:#ff0;">  
       <h1>One</h1> 
      </div> 
     </div><!-- /page one --> 

Answer 1

あなたのナビゲーションバーのためのスペースを作るためにdata-role="page"の要素のCSSを変更することができます。

.ui-mobile [data-role="page"] { 
    left : 200px !important; 
    width : auto !important; 
    right : 0; 
} 
#leftNav { 
    position : absolute; 
    top  : 0; 
    left  : 0; 
    width : 200px; 
    height : 100%; 
    z-index : 100; 
}​ 

#leftNavは、ナビゲーションバーの要素である：ここで

<div class="ui-body-a" id="leftNav"> 
    <a data-direction="reverse" href="#zero">Zero</a> 
    <a href="#one">One</a> 
</div> 

はデモです： http://jsfiddle.net/j8nkn/2/

これは完璧ではありませんが、これはあなたを始めなければなりません。