rem布局进入页面样式错乱解决
开发项目时候第一次遇到rem布局进入页面瞬间样式错乱问题：
//该段js为rem布局应用 如10px = 0.1rem;
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
if(!clientWidth) return;
if(clientWidth >= 750) {
docEl.style.fontSize = '100px';
} else {
//alert(clientWidth);
docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
}
};
if(!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
解决方案（jq）：先设置body如下图，然后再显示
<body style="display: none;">
$("body").css("display","block")
input框呼起键盘（必须禁用方法如下）：
<input class="preDate" type="text" placeholder="请输入预产期" onfocus="this.blur();" />
rem布局进入页面样式错乱解决的更多相关文章
- 架构师小跟班：SSL证书免费申请及部署，解决页面样式错乱问题完整攻略
申请证书 1.登录阿里云控制台,产品与服务,选择SSL证书 2.进入SSL证书页面,点击“购买证书”,选择免费1年的证书类型,点击“立即购买” 3.返回SSL证书页面,可以看到证书列表里多了一条记录 ...
- lib-flexible 结合 WKWebView 的样式错乱解决方法
技术栈 lib-flexible 是淘宝的可伸缩方案 WKWebView 是ios8以上支持的网页控件 问题场景 最新公司一个项目使用 lib-flexible 来做移动端的伸缩解决方案,页面在saf ...
- ASP.NET后台JS弹框使前台页面样式丢失 解决办法
Response.Write("<script>alert('您还没有上传相关图片!');</script>");是向前台输出js 应该用下面的方法 Cli ...
- 81.node.js前端html时页面格式错乱解决办法
var http = require("http"); var url = require("url"); var fs = require("fs& ...
- 手机端页面自适应解决方案—rem布局进阶版
手机端页面自适应解决方案—rem布局进阶版 https://www.jianshu.com/p/985d26b40199 注:本文转载之处:https://www.cnblogs.com/anni ...
- 手机端页面自适应解决方案—rem布局（进阶版，附源码示例）
转自:https://segmentfault.com/a/1190000007350680 一年前笔者写了一篇 <手机端页面自适应解决方案—rem布局>,意外受到很多朋友的关注和喜欢.但 ...
- 手机端页面自适应：rem布局
rem布局非常简单,首页你只需在页面引入这段原生js代码就可以了 (function (doc, win) { var docEl = doc.documentElement, resizeEvt = ...
- 手机端页面自适应解决方案—rem布局（该方案目前已过时）
转自:https://segmentfault.com/a/1190000004705207 相信很多刚开始写移动端页面的同学都要面对页面自适应的问题,当然解决方案很多,比如:百分比布局,弹性布局fl ...
- rem手机端页面自适应布局（待修正下一篇完美布局）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 怎样把UCos-ii_在STM32上的移植
下载代码 stm32 标准外设库是 stm32 全系列芯片的外设驱动,有了它能够大大加速我们 开发 stm32. 首先从 st 公司的站点下载最新的 stm32 标准外设库,写本文时最新的版本号是 V ...
- C语言事实上不简单：数组与指针
之前在写C的时候,没怎么留意数组.就这么定义一个.然后颠来倒去的使用即可了.只是后来碰到了点问题.解决后决定写这么一篇博客,数组离不开指针.索性就放一起好了. 如今我定义了一个数组:int cc[10 ...
- UVa 10950 - Bad Code
题目:有一种编码方式.串仅仅有小写字母构成,每一个小写字母相应一个数字,如今给你妆化后的数字串, 问有多少个原串与之相应,注意数字串里可能有一个前导0. 分析:搜索.按字母顺序存储映射表,按字母顺序匹 ...
- andriod socket开发问题小结
andriod socket开发问题小结 个人信息:就读于燕大本科软件project专业 眼下大四; 本人博客:google搜索"cqs_2012"就可以; 个人爱好:酷爱数据结构 ...
- openstack （1）----- NTP 时间同步服务
一.标准时间 1.地球分为东西十二个区域,共计24个时区 2.格林威治作为全球标准时间即(GMT时间),东时区以格林威治时区进行加,而西时区则进行减 3.地球的轨道并非正圆,在加上自传速度逐年递减,因 ...
- UVA 1397 - The Teacher's Side of Math(高斯消元)
UVA 1397 - The Teacher's Side of Math 题目链接 题意:给定一个x=a1/m+b1/n.求原方程组 思路:因为m*n最多20,全部最高项仅仅有20.然后能够把每一个 ...
- ZOJ 1806 （小数高精度）
题意:八进制小数转化成十进制的小数. 0.d1d2d3 ... dk [8] = 0.D1D2D3 ... Dm [10] 例: 0.75 [8] = 7*8^-1+5*8^-2 = ( 5/8 + ...
- HDUOJ Number Sequence 题目1005
/*Number Sequence Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Oth ...
- HDU5465/BestCoder Round #56 (div.2) 二维树状数组
Clarke and puzzle 问题描述 克拉克是一名人格分裂患者.某一天,有两个克拉克(aa和bb)在玩一个方格游戏. 这个方格是一个n*mn∗m的矩阵,每个格子里有一个数c_{i, j}ci ...
- Flask的flask-sqlalchemy
flask-sqlalchemy是Flask和SQLAlchemy的管理者 - db = SQLAlchemy() - 包含配置 - 包含ORM基类 - 包含create_all - engine - ...