分享一个很棒的东西：：：：：

优点：不用考虑适配问题，按设计稿进行固定尺寸开发。

1、将下面这段 js 放在页面的<head>中

function bodyScale() {

    var devicewidth = document.documentElement.clientWidth;

    var scale = devicewidth / ;  // 分母——设计稿的尺寸

    document.body.style.zoom = scale;

}

window.onload = window.onresize = function () {

    bodyScale();

};

2、按照设计稿进行固定开发

设计稿切换至px模式，就直接按标注的写啦~

Js 实现页面缩放的更多相关文章

  1. 关于手机端适配的问题（rem，页面缩放）

    关于手机端适配的问题(rem,页面缩放) 96 进击的小前端 关注 2018.02.02 13:57 字数 320 阅读 19评论 0喜欢 0 相信很多和会和我碰到一样的情况,就是你用rem去写移动端 ...

  2. 无障碍阅读：页面缩放兼容性处理（zoom,Firefox火狐浏览器）

    1.无障碍阅读使用场景 无障碍阅读一般在政府类网站使用比较多,如: 天津海事局(http://www.tjmsa.gov.cn/),其中天津海事局的页面放大和页面缩小在firefox浏览器下存在bug ...

  3. js获取页面缩放比例

    今天在网上看到一位大神写的一篇文章,出处记不得了,只是因为我在做项目的时候需要用到所以看了一眼. 经理要求我把两张图表上下排列(非响应式的)改成可以适配浏览器的,刚开始只是想改样式,看到代码才发现原来 ...

  4. JS实现页面进入、返回定位到具体位置

    最为一个刚入职不久的小白...慢慢磨练吧... JS实现页面返回定位到具体位置 其实浏览器也自带了返回的功能,也就是说,自带了返回定位的功能.正常的跳转,返回确实可以定位,但是有些特殊场景就不适用了. ...

  5. js jquery 页面加载初始化方法

    js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...

  6. WOW.js – 在页面滚动时展现动感的元素动画效果

    在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感.WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格.延迟.长度.偏移和迭代等 ...

  7. js中页面刷新和页面跳转的方法总结

    .js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...

  8. Progress.js – 为页面上的任意对象创建进度条效果

    Progress.js 是一个 JavaScript 和 CSS3 的库,它帮助开发人员为网页上的每个对象创建和管理进度条效果.你可以设计自己的模板,进度条或者干脆定制. 您可以使用 Progress ...

  9. JS刷新页面总和！多种JS刷新页面代码!

    1)<meta http-equiv="refresh"content="10;url=跳转的页面">10表示间隔10秒刷新一次2)<scri ...

随机推荐

  1. flask的配置项及获取

    1 修改/新增配置项的3种方法 # 配置参数的使用方式 # 1. 使用配置文件 # app.config.from_pyfile("config.cfg") # 2. 使用对象配置 ...

  2. Ubuntu 系统信息相关命令

    系统信息相关命令 本节内容主要是为了方便通过远程终端维护服务器时,查看服务器上当前 系统日期和时间 / 磁盘空间占用情况 / 程序执行情况 本小结学习的终端命令基本都是查询命令,通过这些命令对系统资源 ...

  3. 【2017-12-12】Winform----Datagirdview使用

    1.数据绑定 DataGirdView.DataSource = list集合 2.复选框 获取复选框选中状态 for (int i = 0; i < dataGridView1.RowCoun ...

  4. openpose-opencv 的coco数据多人体姿态估计

    介绍 opencv除了支持常用的物体检测模型和分类模型之外,还支持openpose模型,同样是线下训练和线上调用.这里不做特别多的介绍,先把源代码和数据放出来- 实验模型获取地址:https://gi ...

  5. HDU 6735 结论网络流 机器人不重叠路径

    我们可以得到一个结论:没有两个机器人走过的路会重叠 所以题目就转变为了能不能让机器人的路径不重叠且每个机器人能到达终点 直接一个点朝他四连通方向的四个点连容量为1的边即可 #include<bi ...

  6. java堆栈信息查看，以及JVM性能查看工具-jconsole+jmap

    java-core  P487 P515 chapter11,主要讲java的异常,里面很多内容收获良多,之前一直没注意过的. 一,Throwable类获得StackTraceElement ,可进行 ...

  7. "Class does not support Automation or does not support expected interface"数据库连接错误问题分析与解决

    1,故障现象 本人编译的英文版程序在本机上运行OK,换台电脑运行,发现启动时连接数据库出错. 错误信息如下: --------------------------- Error start datab ...

  8. ubuntu 16.04 TLS 安装VNC

    安装 #autocuftsel 用于vnc两段的复制粘贴 sudo apt-get install autocutsel 安装 vncserversudo apt-get install --no-i ...

  9. file控件选择同一文件不触发change事件和img控件不改变src的情况下图片不刷新问题解决

    最近跑来前端掺和了.. file控件的问题用 inputFile.value = ''; img控件的问题,在图片后面添加一串无意义的参数即可,例如: img.src = 'file:///' + 本 ...

  10. MySQL分组排序（取第一或最后）

    MySQL分组排序(取第一或最后) 方法一:速度非常慢,跑了30分钟 SELECT custid, apply_date, rejectrule FROM ( SELECT *, IF ( , ) A ...