JS根据浏览器窗口大小实时动态改变网页文字大小的方法


Posted in Javascript onFebruary 25, 2016

本文实例讲述了JS根据浏览器窗口大小实时动态改变网页文字大小的方法。分享给大家供大家参考,具体如下:

目前,有了css3的rem,给我们的移动端开发带来了前所未有的改变,使得我们的开发更容易,更易兼容很多设备,但这个不在本文讨论的重点中,本文重点说说如何使用js来实时改变网页文字的大小。

代码如下:

<script>
 /* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */
 function placeholderPic(){
  var w = document.documentElement.offsetWidth;
  document.documentElement.style.fontSize=w/20+'px';
 }
 placeholderPic();
 window.onresize=function(){
  placeholderPic();
 }
</script>
Javascript 相关文章推荐
js对象数组按属性快速排序
Jan 31 Javascript
angularjs的一些优化小技巧
Dec 06 Javascript
javascript实现网页中涉及的简易运动(改变宽高、透明度、位置)
Nov 29 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
May 09 Javascript
浅谈JS中的!=、== 、!==、===的用法和区别
Sep 24 Javascript
Angular-Touch库用法示例
Dec 22 Javascript
在angular 6中使用 less 的实例代码
May 13 Javascript
详解koa2学习中使用 async 、await、promise解决异步的问题
Nov 13 Javascript
跨域解决之JSONP和CORS的详细介绍
Nov 21 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
Sep 28 Javascript
js实现弹窗效果
Aug 09 Javascript
原生JS生成指定位数的验证码
Oct 28 Javascript
你所未知的3种Node.js代码优化方式
Feb 25 #Javascript
jQuery使用contains过滤器实现精确匹配方法详解
Feb 25 #Javascript
原生javascript实现addClass,removeClass,hasClass函数
Feb 25 #Javascript
javascript随机抽取0-100之间不重复的10个数
Feb 25 #Javascript
JavaScript实现多种排序算法
Feb 24 #Javascript
JavaScript中的时间处理小结
Feb 24 #Javascript
JS设置cookie、读取cookie
Feb 24 #Javascript
You might like
sqlyog 中文乱码问题的设置方法
2008/10/19 PHP
phpcms模块开发之swfupload的使用介绍
2013/04/28 PHP
ThinkPHP实现事务回滚示例代码
2014/06/23 PHP
php实现的一个简单json rpc框架实例
2015/03/30 PHP
[原创]PHP实现字节数Byte转换为KB、MB、GB、TB的方法
2017/08/31 PHP
PHP xpath()函数讲解
2019/02/11 PHP
JavaScript中this关键字使用方法详解
2007/03/08 Javascript
javascript中的几个运算符
2007/06/29 Javascript
JavaScript高级程序设计(第3版)学习笔记6 初识js对象
2012/10/11 Javascript
Jquery中扩展方法extend使用技巧
2014/08/24 Javascript
jQuery中animate用法实例分析
2015/03/09 Javascript
浅谈javascript的分号的使用
2015/05/12 Javascript
JavaScript实现动态添加,删除行的方法实例详解
2015/07/02 Javascript
Vue.js基础知识汇总
2016/04/27 Javascript
很棒的Bootstrap选项卡切换效果
2016/07/01 Javascript
Mongoose经常返回e11000 error的原因分析
2017/03/29 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
关于javascript获取内联样式与嵌入式样式的实例
2017/06/01 Javascript
JS实现快速比较两个字符串中包含有相同数字的方法
2017/09/11 Javascript
vue cli 全面解析
2018/02/28 Javascript
vue组件横向树实现代码
2018/08/02 Javascript
Intellij IDEA搭建vue-cli项目的方法步骤
2018/10/20 Javascript
vue项目中使用scss的方法步骤
2019/05/16 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
Python+AutoIt实现界面工具开发过程详解
2019/08/07 Python
通过实例简单了解python yield使用方法
2020/08/06 Python
Python Pandas list列表数据列拆分成多行的方法实现
2020/12/14 Python
纯CSS3制作的鼠标悬停时边框旋转
2017/01/03 HTML / CSS
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
CSMA/CD介质访问控制协议
2015/11/17 面试题
创业计划书六个要素
2013/12/26 职场文书
大专学生求职自荐信
2014/07/06 职场文书
2014年禁毒工作总结
2014/11/24 职场文书
北京导游词
2015/02/12 职场文书
医院办公室主任岗位职责
2015/04/01 职场文书
centos环境下nginx高可用集群的搭建指南
2022/07/23 Servers