jQTouchとBackbone.jsルーティング/ビュー

Question

Backbone.jsで最新のjQTouchを使用している人がいれば、どうすればjQTouchの代わりにBackboneのルーターとビューを使ってページ間の移行を自動的に処理して、divハッシュに関連する特定のID。

Answer 1

jQTouchで何を達成しようとしていますか？ AFAIKは軽量モバイルフレームワークで、divを表示して非表示にして1ページのモバイルWebアプリケーションを構築できます。それはあなたを与える三つの主要なもの：

1. ニースモバイルUIエレメントページ間
2. CSS3トランジション（スライド、ポップ、フェード、など）。自動的にあなたが触れるUI要素に基づいて、ページ間の遷移
3. ナビゲーションフレームワーク（例えばHREF #aboutでアンカーを触れるID aboutのページ（DIV）に、現在のページからの自動遷移）

I 1）と2）あなたの人生をより簡単にしたい、そしてBackBoneが3）を処理することを希望しているとします。これはBackBoneのMVC構造とビュー間のイベント伝播がうまくいくので意味があります。この場合、本当に1）と2）はCSSトリックです。したがって、jqtouch.cssと溝jqtouch.jsを保管してください。そうすれば、すばらしいスタイリングがすべて得られ、ナビゲーションを扱う際にjqTouchを使用することなく、プログラムでバックボーンビューのトランジションを実行できます。

アプリ全体を<div id="jqt"></div>にラップすることを忘れないでください。そうすれば、スタイルシートはすべてのリスト要素とボタンを見つけてスタイルします。トランジションを使用したい場合は、jQueryの/ Zeptoは、各ページへの正しいCSSを追加使用します

$("#toPage").addClass('slideleft in current'); 
$("#fromPage").addClass('slideleft out'); 

これはjqtouch.cssで指定されたCSS3トランジションをトリガーします。利用可能なトランジションのリストは、jqtouch.jsの61行目以降にあります。上記のコードでslideleftを別のアニメーション名に変更して、別のトランジションを達成してください。

免責事項！私は実際にこれを試したことはなく、理論だけしか働かないかもしれません...私はこれを正確に達成しようとしていますが、BackBoneで素晴らしいモバイルUIテーマを使用しています。私がチャンスを得ると、私は数日後にこれを試してコードします。あなたが最初にそこに着いてそれを試みたら、あなたがどのように乗っているか教えてください！