jQueryモバイルでページをナビゲートしますか？

Question

私は3ページのモバイルに最適化されたウェブサイトを作っています。 jQueryモバイルが提供するように、水平方向のスライドナビゲーションが必要です。 1ページ目で2ページに移動すると、2ページ目が右側からスライドします。

しかし、ページ1からページ3に移動することもできます。そうした場合は、ページ2と同じ方法でページ3をスライドさせたくありません。その代わりに私はスライドするために2ページが必要とし、次に3ページのスライドを代わりに動かす必要があります。

ここは私のjavascriptデモです。 1ページから「マップ」をクリックすると、ページ1が過去2ページに行くには2ページをクリックする「1」になり、http://smartpeopletalkfast.co.uk/pos/

アイブ氏は、このしかし、イムを行い、より複雑なデモを作っ3.

ページに移動しますクロスデバイスやその他の予期しない問題がたくさんあるので、idはjQueryモバイルのようなフレームワークを使用するのが大好きです。おかげ

Answer 1

あなたがハイジャックすることができますリンクをクリックして、必要なアニメーションと正しい擬似ページにユーザーを送信します。これは、.my-linksクラスを持つ任意の要素に結合する

$(function() { 

    //create an associative array of objects to pas to the `changePage()` function for a specific transition 
    var convert = { 

      //from page1 
      page1 : { 

       //to page2 
       page2 : { transition : 'slide'}, 

       //to page3 
       page3 : { transition : 'slide'} 
      }, 

      //from page2 
      page2 : { 

       //to page1 
       page1 : { transition : 'slide', direction : 'reverse' }, 

       //to page3 
       page3 : { transition : 'slide'} 
      }, 

      //from page3 
      page3 : { 

       //to page1 
       page1 : { transition : 'slide', direction : 'reverse' }, 

       //to page2 
       page2 : { transition : 'slide', direction : 'reverse' } 
      } 
     }; 
    $('.my-links').bind('click', function() { 

     //change to the specified page 
     $.mobile.changePage($(this).attr('href'), convert[$.mobile.activePage[0].id][$(this).attr('href').replace('#', '')]); 
     return false; 
    }); 
}); 

。また、page/page2/page3は、3ページのIDです。