js實(shí)現(xiàn)適配不同的屏幕大小
更新時(shí)間：2017年04月10日 08:25:17 作者：語(yǔ)潸雪
本文主要介紹了通過(guò)js適配不同的屏幕大小的相關(guān)知識(shí)。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
話不多說(shuō)，請(qǐng)看代碼：
// 通過(guò)js適配不同的屏幕大小
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
// 根據(jù)設(shè)備的比例調(diào)整初始font-size大小
if(clientWidth>640) clientWidth = 640;
docEl.style.fontSize = 50 * (clientWidth / 320) + 'px';
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！
您可能感興趣的文章:
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)錄音功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
兼容Firefox的Javascript XSLT 處理XML文件
這篇文章主要介紹了兼容Firefox的Javascript XSLT 處理XML文件,需要的朋友可以參考下2014-12-12
JS組件Bootstrap實(shí)現(xiàn)彈出框效果代碼
這篇文章主要介紹了JS組件Bootstrap實(shí)現(xiàn)彈出框效果代碼的相關(guān)資料，對(duì)彈出框感興趣的小伙伴們可以參考一下2016-04-04
將函數(shù)名作為指向函數(shù)的指針，有助于理解為什么ECMAScript中沒(méi)有函數(shù)重載的概念,需要的朋友可以參考下2014-08-08
優(yōu)化 JavaScript 代碼的方法小結(jié)
客戶端腳本能讓你的應(yīng)用更加地動(dòng)態(tài)和活躍， 但是瀏覽器對(duì)代碼的解析可能造成效率問(wèn)題， 而這種性能差異在客戶端之間也不盡相同。 這里我們討論和給出一些優(yōu)化你的 JavaScript 代碼的提示和最佳實(shí)踐。2009-07-07
這篇文章主要為大家學(xué)習(xí)介紹了JavaScript如何實(shí)現(xiàn)Excel文件與圖片視頻上傳，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-07-07
這篇文章主要為大家詳細(xì)介紹了JavaScript中獲取HTML元素值的三種方法，分享了JavaScript中取得元素的方法，感興趣的小伙伴們可以參考一下2016-06-06
Javascript檢查圖片大小不要讓大圖片撐破頁(yè)面
用Javascript判斷圖片大小，其實(shí)只要寫(xiě)一個(gè)簡(jiǎn)單的函數(shù)就可以了，使用其他語(yǔ)言進(jìn)行判斷，過(guò)程比較復(fù)雜，用 Javascript 判斷輕松搞定2014-11-11
本文為大家介紹下如何使用js捕獲鼠標(biāo)滾輪事件，原理很簡(jiǎn)單，感興趣的朋友可以參考下2013-12-12
最近在學(xué)習(xí)微信小程序，下面就學(xué)習(xí)的內(nèi)容進(jìn)行總結(jié)，這篇文章主要給大家介紹了關(guān)于微信小程序利用co處理異步流程的方法，文中給出了詳細(xì)的介紹和示例代碼供大家參考學(xué)習(xí)，需要的朋友們下面來(lái)一起看看吧。2017-05-05