移动端自适应js
window.addEventListener('resize', setHtmlFontSize)
setHtmlFontSize();
function setHtmlFontSize() {
var windowWidth = document.documentElement.offsetWidth;
if (windowWidth > 640) {
windowWidth = 640;
} else if (windowWidth < 320) {
windowWidth = 320;
}
var StandardWidth = 375;
var StandardHtmlFontSize = 16;
var htmlFontSize = windowWidth / StandardWidth * StandardHtmlFontSize;
document.querySelector('html').style.fontSize = htmlFontSize + 'px';
}
移动端自适应js的更多相关文章
- 有了这套flexible.js 移动端自适应方案,你就能在移动端的来去自如, (*^__^*)
flexible.js 移动端自适应方案 一,flexible.js 的使用方式: github地址:https://github.com/amfe/lib-flexible 官方文档地址:https ...
- webstorm下的sass自动编译和移动端自适应实践
1.安装Ruby 2.安装sass 3.webstorm配置file watcher 4.移动端自适应 1.安装Ruby 安装Ruby,有多种方式,打开官网下载 因为,使用的是window选择Ruby ...
- rem 结合 scss 移动端自适应 初级入门demo
首先说明 本篇 内容 适合初级使用 rem 开发移动端 自适应 公式计算 推导过程, 高手绕路. 目标尺寸 = rem * 根字体大小 Px = rem * (html根字体px) 根字体大 ...
- 【转载】rem自适应布局-移动端自适应必备
原文链接:rem自适应布局-移动端自适应必备 版权所有,转载时请注明出处,违者必究. 由于移动端特殊性,本文讲的是如何使用rem实现自适应,或叫rem响应式布局,通过使用一个脚本就可以rem自适应,不 ...
- 基于vue-cli配置移动端自适应
移动端自适应:手淘的 lib-flexible + rem 配置 flexible 安装 lib-flexible 在命令行中运行如下安装: 1 npm i lib-flexible --save 引 ...
- vue+vue-cli+淘宝lib-flexible做移动端自适应
总结用vue+vue-cli+淘宝lib-flexible做移动端自适应方案: 1.安装淘宝lib-flexible npm install lib-flexible --save 2.在入口文价ma ...
- 处理移动端自适应布局的方法- calc()与vw
在处理移动端自适应布局时,目前前端最流行的方法应该就是使用媒体查询,来设置HTML的字体大小,然后用rem为单位对Dom的宽高进行设置,这个方法的优势在于兼容性方面很好,劣势则在于当前市场上不同的机型 ...
- PC端自适应布局
截止目前,国内绝大多数内容为主的网站(知乎,果壳,V2EX,网易新闻等)均使用内容区定宽布局,大多数电商网站(网易考拉,京东,聚美优品)也使用了内容区定宽的布局,也有些网站使用了自适应布局: 天猫 内 ...
- 移动端报表JS开发示例--获取定位
上次分享了移动端报表JS开发的系统概念,后来我又回去摸索了一些案例.之前接触到的FineReport的APP客户端可以用来打卡签到,就好奇研究了以下,这次就来聊一聊报表移动端开发如何实现定位功能. 1 ...
随机推荐
- Android StickyListHeadersListView头部悬停 分组列表实现
最近在做分组列表,头部悬停的效果,在github上就搜到了StickyListHeaders(https://github.com/emilsjolander/StickyListHeaders)这个 ...
- `GLIBCXX_3.4.15' not found when using mex file in matlab (linux)
from: http://www.360doc.com/content/14/0314/16/175261_360565922.shtml Invalid MEX-file '*/*/*.mexa64 ...
- mysql查看索引的大小
1 ,show table status from your_database_name 这个不准: 2,这个比较详细 select database_name, table_name, index ...
- 如何利用 iTunes 把 m4a/wav 文件转成 MP3 格式
MAC技巧 | 如何利用 iTunes 把 m4a/wav 文件转成 MP3 格式 - 简书
- fabric.js 知识点整理
fabric.js是一个很好用的 canvas 操作插件,下面整理了一些平时项目中用到的知识点: //1: 获得画布上的所有对象: var items = canvas.getObjects(); / ...
- netty--buffer分配策略
AdaptiveRecvByteBufAllocator 动态分配buffer大小的类. 如果前一次读取完全填满了分配的缓冲区,它将逐渐增加预期的可读字节数.(增加的方式:初始化类的时候,会预先设置好 ...
- 在论坛中出现的比较难的sql问题:46(日期条件出现的奇怪问题)
原文:在论坛中出现的比较难的sql问题:46(日期条件出现的奇怪问题) 最近,在论坛中,遇到了不少比较难的sql问题,虽然自己都能解决,但发现过几天后,就记不起来了,也忘记解决的方法了. 所以,觉得有 ...
- C#使用消息队列(MSMQ)
最近项目用到消息队列,找资料学习了下.把学习的结果 分享出来 首先说一下,消息队列 (MSMQ Microsoft Message Queuing)是MS提供的服务,也就是Windows操作系统的功能 ...
- axios配置及使用(发起请求时带上token)
1.安装 利用npm安装 npm install axios --save 2.引入即可使用 import axios from 'axios' 3.目录 4.各个文件设置: (1)env.js ex ...
- arm-none-eabi/bin/ld: build/com.zubax.gnss.elf section `.text' will not fit in region `flash'
出现如下错误: /arm-none-eabi/bin/ld: build/com.zubax.gnss.elf section `.text' will not fit in region `flas ...