摘要: 背景概述
Google已經(jīng)在Mobile Web App開發(fā)上取得了很大的突破. HTML5已經(jīng)拉近了Mobile設備Native App與Web App的差距. mobile Gmail 正是Google的Fixed position的最佳實踐之一. iPad上的基于兩欄的Gmail也運用了這種實現(xiàn)機制.
桌面瀏覽器本身就支持 position: fixed. 但 mobile Safari在iOS5之前不支持, 我們只能定制一個模擬滾動的工具來替代原生的滾動.
本教程就是在Mobile Web App上如何實現(xiàn)position: fixed的,就以下幾點來講:
如何布局
通過transforms實現(xiàn)滾動的動畫效果
通過 transitions實現(xiàn)滾動的慣性沖力
觸摸屏幕時中止?jié)L動,即在打斷 transitions的執(zhí)行
跳轉看詳情
http://www.iunbug.com/2012/06/03/%E7%BF%BB%E8%AF%91%E6%89%8B%E6%8A%8A%E
閱讀全文