2012-01-23 35 views
6

Tôi tự hỏi liệu có ai đang sử dụng jQTouch mới nhất với Backbone.js không và liệu chúng có xử lý chuyển đổi giữa các trang bằng cách sử dụng các bộ định tuyến và khung nhìn của Backbone thay vì jQTouch tự động cố gắng hiển thị div ID cụ thể liên quan đến băm.jQTouch và Backbone.js Định tuyến/Lượt xem

+0

Bạn đã cân nhắc sử dụng Sencha Touch, có vẻ như đó là những gì bạn đang xây dựng vào thời điểm này. – Prospero

Trả lời

7

Bạn đang cố gắng đạt được gì với jQTouch? AFAIK, nó là một khung di động nhẹ cho phép bạn xây dựng một ứng dụng web di động đơn bằng cách hiển thị và ẩn các div. Ba điều chính nó mang lại cho bạn:

  1. đẹp các yếu tố giao diện người dùng điện thoại di động
  2. chuyển tiếp CSS3 giữa các trang (slide, pop, phai, vv).
  3. Một khung định vị tự động chuyển tiếp giữa các trang dựa trên các yếu tố giao diện người dùng bạn chạm (ví dụ như chạm vào một neo với href #about sẽ chuyển tự động từ trang hiện tại để trang (div) bằng ID about)

tôi giả sử bạn muốn giữ 1) và 2) để làm cho cuộc sống của bạn trở thành một dev dễ dàng hơn, và BackBone để xử lý 3) - điều này có ý nghĩa với tôi như cấu trúc MVC của BackBone và sự kiện tuyên truyền giữa các lượt xem là tốt đẹp. Nếu đây là trường hợp, thực sự 1) và 2) chỉ là thủ thuật CSS. Vì vậy, giữ jqtouch.css và mương jqtouch.js. Bằng cách đó, bạn có được tất cả các kiểu dáng đẹp và có thể lập trình thực hiện quá trình chuyển đổi trong quan điểm BackBone của bạn, mà không cần jqTouch nhận được trong cách khi giao dịch với chuyển hướng.

Nếu bạn làm điều này, hãy nhớ bao bọc toàn bộ ứng dụng của bạn trong <div id="jqt"></div> để biểu định kiểu tìm và tạo kiểu cho tất cả các thành phần và nút danh sách của bạn. Khi bạn muốn sử dụng một quá trình chuyển đổi, sử dụng jQuery/Zepto thêm CSS đúng vào mỗi trang:

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

này sẽ kích hoạt các hiệu ứng chuyển tiếp CSS3 quy định tại jqtouch.css. Danh sách các chuyển tiếp có sẵn có thể được tìm thấy trong jqtouch.js, dòng 61 trở đi. Chỉ cần thay đổi slideleft trong đoạn mã ở trên để có tên hoạt ảnh khác để đạt được chuyển đổi khác.

Tuyên bố từ chối trách nhiệm! Tôi đã không thực sự cố gắng này, chỉ có một lý thuyết và có thể không hoạt động ... mặc dù tôi đang cố gắng để đạt được chính xác điều này, sử dụng một giao diện người dùng điện thoại di động tốt đẹp với BackBone, và đây là gần nhất tôi có thể tìm thấy. Khi tôi có cơ hội, tôi sẽ thử và viết mã này trong vài ngày tới. Nếu bạn đến đó trước tiên và thử nó xin vui lòng cho tôi biết làm thế nào bạn nhận được trên!

+0

Tôi chưa có thời gian để thử ý tưởng của bạn, nhưng nó rất thú vị. –

Các vấn đề liên quan