移動端web app開發備忘

標籤：移動   web app   web開發   html5   手機   

最近要做個手機html5的頁面，做些知識儲備，重要的點記錄下來以備後續。

1.devicePixelRatio:定義裝置物理象素和裝置獨立象素的比例。css中的px可以看作是裝置的獨立象素，通過devicePixelRatio，就可以知道裝置上的一個css像素代表著多少個物理像素，可以考慮devicePixelRatio+rem進行不同裝置間的適配；

2.利用Image對象實現圖片的懶載入，主要邏輯代碼如下：

var len = queue.length;var counter = 0;for(var i = 0; i < len; i++){var img = new Image();img.src = Zepto(queue[i]).data("url");img.onload = function(){counter++;if(counter >= len){Logic.onLoadComplete();}}}

通過new Image()建立Image對象，然後監聽其onload事件，當載入完成後進行載入完畢的處理。

3.Zepto.js，專為移動端web開發，更小更輕便，API和jquery類似。中文手冊地址：http://www.html-5.cn/Manual/Zepto

移動端web app開發備忘