移動端web開發

2021-08-08 22:00:13 字數 864 閱讀 4741

"viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">

//width:設定視口寬度

//initial-scale:初始化縮放比,大於0的數字

//maximum-scale:最大縮放比,大於0的數字

//minimum-scale:最小縮放比,大於0的數字

//user-scalable:使用者是否可以縮放,yes/no,也可以是1/0

四、事件

1、觸碰螢幕時觸發:touchstart

2、滑動螢幕時觸發:touchmove

3、離開螢幕時觸發:touchend

4、系統停止跟蹤觸碰時觸發:touchcancel

其中,touchstart事件+touchend事件等價於click事件,但移動端的click事件具有延遲,因而開發人員不會使用,故,自行封裝了乙個函式代替click事件,該事件不會有延遲

function

tap(obj,callback))

//監聽touchmove事件

obj.addeventlistener("touchmove",function

()) obj.addeventlistener("touchend",function

() //復原

ismove=false;

star=0;

end=0;

distance=0;

})}

移動端Web開發

移動端web開發與pc端的web開發有尺寸上的不同,手機螢幕大小有很多種,因此尺寸方面有些要注意的。1.字型 採用js動態設定字型大小的方法 思路如下 螢幕寬度 640px,則font size 100px 螢幕寬度 640px,則font size 100 寬度 640px 字型單位為rem 在b...

移動端web開發

互動優化 1px dpr dpr dp viewport使手機瀏覽器先排版正確再縮放 移動web最佳設定 viewport content width device width,initial scale 1,user scalable no 相容性問題根據html的font size,基值設dev...

移動端web開發

領導要求公司 要做個移動版,查詢相關的資料,以下簡單的總結供領導看。在使用者訪問的時候,先判斷下是pc端還是移動端,是移動的話就是來訪問移動端web頁面。當然的也可以做成pc端和移動端都通用的,但在做的過程中一定會遇到很多問題,一次就做成這樣,心裡沒有太大的把握。就是先做乙個,總結一下經驗。1.先從...