js整體縮小網頁 js實現整體縮放頁面適配移動端

2021-10-13 00:21:05 字數 1150 閱讀 8251

* 該 js 中,包含常用的 ua 判斷、頁面適配、search 引數轉 鍵值對。

* 該 js 應在 head 中盡可能早的引入,減少重繪。

* fixscreen 方法根據兩種情況適配,該方法自動執行。

*  1. 定寬(視窗縮放): 對應 meta 標籤寫法 --

750 是效果圖內容區域的寬度,一般為 640 或 750

*   該方法會提取 width 值,主動新增 scale 相關屬性值。

*   注意: 如果 meta 標籤中指定了 initial-scale, 該方法將不做處理(即不執行)。

*  2. rem: 不用寫 meta 標籤,該方法根據 dpr 自動生成,並在 html 標籤中加上

data-dpr 和 font-size 兩個屬性值。

*   該方法約束:ios 系統最大 dpr = 3,其它系統 dpr = 1,頁面每 dpr 最大寬度

(即頁面寬度/dpr) = 750,rem 換算比值為 16。

*   對應 css 開發,任何彈性尺寸均使用 rem 單位,rem 預設寬度為 視覺稿寬度 / 16;

*   scss 中 $ppr(pixel per rem) 變數寫法 -- $ppr: 750px/16/1rem;

*   元素尺寸寫法 -- html body 。

window.mobileutil = (function(win, doc) ,false);

win.addeventlistener('pageshow',function(e) ,false);

refreshrem();

}else if ( ismobile && !matchscale && ( matchwidth && matchwidth[1]

!='device-width' ) ) 指定的href,預設為當前頁href

* @returns 鍵值對

getsearch:function(href) ,reg =new regexp("([^?=&]+)(=([^&]*))?","g" );

href && href.replace(reg,function( $0, $1, $2, $3 ))(window, document);

// 預設直接適配頁面

mobileutil.fixscreen();

js整體縮小網頁 js實現整體縮放頁面適配移動端

大家在適配頁面的web端和移動端時候,如果不需要那麼麻煩,就可以使用js進行整體縮放,只需要引入乙個js,改動htmll頭部 即可 切記 1.該 js 應在 head 中盡可能早的引入,減少重繪。2.定寬 視窗縮放 對應 meta 標籤寫法 750 是效果圖內容區域的寬度,一般為 640 或 750...

js呼叫印表機 列印整體或部分

有時前端的專案中需要新增列印的功能,首先要知道列印分為整體列印和區域性列印兩種,而區域性列印又可細分為區域性列印指定的部分,和區域性列印指定部分之外的部分。例項比文字看起來更清晰,下面我將用 來描述 這是最簡單的部分 列印全部 print1 click function 簡單的一行js 即可搞定 下...

js呼叫印表機 列印整體或部分

有時前端的專案中需要新增列印的功能,首先要知道列印分為整體列印和區域性列印兩種,而區域性列印又可細分為區域性列印指定的部分,和區域性列印指定部分之外的部分。例項比文字看起來更清晰,下面我將用 來描述 1 整體列印 這是最簡單的部分 列印全部 print1 click function 簡單的一行js...