rem js相关

来源:http://www.chinese-glasses.com 作者:Web前端 人气:121 发布时间:2020-03-24
摘要:M N中,若M为假,则N不被执行;M||N中,若M为真,则N不被执行。 时间: 2019-11-07阅读: 229标签: rem 规则就是,调用函数,放两个参数,第一个参数,是设计稿的宽度,第二个参数是px与

M N中,若M为假,则N不被执行;M||N中,若M为真,则N不被执行。

时间: 2019-11-07阅读: 229标签: rem

规则就是,调用函数,放两个参数,第一个参数,是设计稿的宽度,第二个参数是px与rem的转换比例,通常会写100(因为好算);当然了,要把这段js代码最好封装在一个单独的js文件里,并且放在所有的css文件引入之前加载。

代码一:

(function(win) {if(!win.addEventListener) return;var html = document.documentElement;function setFont() {function setRem() {var cliWidth = html.clientWidth;var w = document.documentElement.clientWidth,h = document.documentElement.clientHeight;var val = 640;if(w = 640) {cliWidth = 640;}// if(w  h) {// //横屏// val = 1334;// }html.style.fontSize = 100 * (cliWidth / val) + ‘px‘;}setRem();setTimeout(function() {setRem();}, 300);}win.addEventListener(‘resize‘, setFont, false);setFont();})(window);
!function(n){ var e=n.document, t=e.documentElement, i=720, d=i/100, o="orientationchange"in n?"orientationchange":"resize", a=function(){ var n=t.clientWidth||320;n720(n=720); t.style.fontSize=n/d+"px" }; e.addEventListener(n.addEventListener(o,a,!1),e.addEventListener("DOMContentLoaded",a,!1))}(window);
//屏幕适应(function(win, doc) {if(!win.addEventListener) return;var html = document.documentElement;function setFont() {var html = document.documentElement;var cliWidth = html.clientWidth;var k = 640;if(cliWidth = 640) {cliWidth = 640;}html.style.fontSize = cliWidth / k * 100 + "px";}setFont();setTimeout(function() {setFont();}, 300);doc.addEventListener(‘DOMContentLoaded‘, setFont, false);win.addEventListener(‘resize‘, setFont, false);win.addEventListener(‘load‘, setFont, false);})(window, document);

上面这段js手机上在有表单的时候,在输入法弹出的时候会失灵

其中 var n=t.clientWidth||320;n720(n=720);的意思是:如果clientWidth的值获取不到,n就等于320,如果n720成立就会执行n=720的操作

代码二 :

本文由10bet发布于Web前端,转载请注明出处:rem js相关

关键词:

上一篇:微信小程序适配 iPhone【10bet】 11/Pro

下一篇:没有了

频道精选

最火资讯