mobilebone.js

單頁切換骨架。適用于移動web APP, Hybird混合APP, Phonegap開發等。

為何需要？

類原生APP的過場體驗，適用于這些場景：
1. Phonegap等類似跨移動開發平臺，其靜態頁面都是index.html, 單頁面，因此，需要跟原生一樣的過場體驗。
2. Hybird app開發，原生APP內嵌web APP, 為了兩者體驗一致，不至于交互太唐突，也需要無刷新過場效果。
3. 就算是純粹的移動web APP, 使用無刷新模式也不失為一種不錯的選型策略。

如何使用？

引入相關的CSS以及JS, 如下：

<link rel="stylesheet" href="mobilebone.css">

<script src="mobilebone.js"></script>

HTML結構需要有一定的要求：

body
  page
  page
  page

每個page是個滿屏元素, 相當于一個獨立的頁面。

Mobilebone會自動捕獲頁面上的a元素，如果其href值存在貓膩，就會觸發切換行為。例如：

<a href="#targetPage">target page</a>

當tap此元素時候，頁面會自動無刷新切換到id為targetPage的頁面。你可以控制切換的方向，或者使用Ajax獲取HTML或JSON, 可以被seajs, requiejs模塊化加載(require('mobilebone'))，可以和Backbone組合使用等。

更多信息請參考這里.

優勢？

mobilebone.js只做了一件事情，切換。所以，JS文件很小，gzip后3~4K, 而且很靈活，幾乎沒有任何UI的限制，適用于各個項目各個場景。

項目主頁：http://www.baiduhome.net/lib/view/home/1417167401159