之前寫h5註冊頁的時候,總是適配不好,用過**查詢,但是效果不太好,而且要適配的尺寸太多了,總歸有遺漏的,時長達不到ui設計圖的標準,後來在網上找了一篇適配的js**,但是因為不太明白,所以使用的也不好哈哈,現在算是明白了點,故將**放上 原文出處:
; (function (designwidth, maxwidth) ';
}if (docel.firstelementchild) else
//要等 wiewport 設定好後才能執行 refreshrem,不然 refreshrem 會執行2次;
refreshrem();
win.addeventlistener("resize", function () , false);
win.addeventlistener("pageshow", function (e)
}, false);
if (doc.readystate === "complete") else , false);
}})(1080, 1920);
最後有兩個引數是需要手動調整的,分別是 設計稿的寬度和最大寬度,我這裡設計稿的寬度是1080,然後給他設定的最大寬度是1920,設定好之後就可以隨心所欲地使用rem了哈哈
比如說量的尺寸是距離頂部882px
,我們可以這樣寫top:8.82rem
,原尺寸除以100
就可以了,這段**要放在頭部script
標籤的最前面
手機端h5頁面介面分功能
今天寫程式遇到了手機端的分頁問題,以前沒遇到過類似問題,pc端的分頁都是有幾個按鈕,可以自主選擇分頁。但是手機端的之前沒遇到過,後來的解決方案是加了乙個loading的gif,然後看完一頁之後先載入loading,然後等到介面請求成功之後,顯示介面請求的內容,把loading圖示隱藏。如此反覆,知道...
h5頁面的寫法 移動端h5頁面寫法
1.頁面寬度320,所有元素尺寸設一半 缺點 不自能適應全屏 2.頁面寬度640,元素尺寸正常 暫未發現問題 3.頁面寬度640,js控制自適應全屏 adaptuilayout.adapt initviewportwidth 缺點 qq空間分享後點開頁面套在qq預設瀏覽器裡有相容性問題 4.rem寫...
移動端h5頁面適配
一直對h5頁面充滿崇敬,揣著忐忑的心開始了我的h5之旅。才發現直接照抄網上的方案是很容易,但是想真的了解內部的原理,這就給我了乙個下馬威了.通過在網上各種找資料,才將各種概念以及原理了解清楚.故寫下這篇文章用於積累知識,如有問題,歡迎指正 先來看看很多資料上面的描述 它是物理概念,指的是裝置中使用的...