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 相关文章推荐
Prototype 学习 工具函数学习($A方法)
Jul 12 Javascript
基于jquery的返回顶部效果(兼容IE6)
Jan 17 Javascript
JavaScript通过select动态更换图片的方法
Mar 23 Javascript
jQuery三级下拉列表导航菜单代码分享
Apr 15 Javascript
Knockoutjs 学习系列(一)ko初体验
Jun 07 Javascript
jquery 属性选择器(匹配具有指定属性的元素)
Sep 06 Javascript
解决AngualrJS页面刷新导致异常显示问题
Apr 20 Javascript
WebPack配置vue多页面的技巧
May 15 Javascript
Vue核心概念Getter的使用方法
Jan 18 Javascript
Vue-cli3.x + axios 跨域方案踩坑指北
Jul 04 Javascript
Js Snowflake(雪花算法)生成随机ID的实现方法
Aug 26 Javascript
vue3引入highlight.js进行代码高亮的方法实例
Apr 08 Vue.js
你所未知的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
PHP+.htaccess实现全站静态HTML文件GZIP压缩传输(一)
2007/02/15 PHP
WordPress判断用户是否登录的代码
2011/03/17 PHP
php中++i 与 i++ 的区别
2012/08/08 PHP
php页面防重复提交方法总结
2013/11/25 PHP
destoon实现调用当前栏目分类及子分类和三级分类的方法
2014/08/21 PHP
php通过array_push()函数添加多个变量到数组末尾的方法
2015/03/18 PHP
laravel框架中表单请求类型和CSRF防护实例分析
2019/11/23 PHP
Mootools 1.2教程 类(一)
2009/09/15 Javascript
flexigrid 参数说明
2010/11/23 Javascript
JQuery在页面中添加和除移DOM示例代码
2013/06/24 Javascript
15条JavaScript最佳实践小结
2013/08/09 Javascript
JS实现Enter键跳转及控件获得焦点
2013/08/12 Javascript
简述AngularJS的控制器的使用
2015/06/16 Javascript
JavaScript动态创建form表单并提交的实现方法
2015/12/10 Javascript
Js类的静态方法与实例方法区分及jQuery拓展的两种方法
2016/06/03 Javascript
微信小程序 css使用技巧总结
2017/01/09 Javascript
浅析java线程中断的办法
2018/07/29 Javascript
又拍云 Node.js 实现文件上传、删除功能
2018/10/28 Javascript
JS实现随机抽选获奖者
2019/11/07 Javascript
python实现根据月份和日期得到星座的方法
2015/03/27 Python
Python的设计模式编程入门指南
2015/04/02 Python
使用优化器来提升Python程序的执行效率的教程
2015/04/02 Python
python多进程实现进程间通信实例
2017/11/24 Python
django页面跳转问题及注意事项
2019/07/18 Python
python正则-re的用法详解
2019/07/28 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
python 基于卡方值分箱算法的实现示例
2020/07/17 Python
两种CSS3伪类选择器详细介绍
2013/12/24 HTML / CSS
用HTML5实现网站在windows8中贴靠的方法
2013/04/21 HTML / CSS
兰芝美国网上商城:购买LANEIGE睡眠面膜等
2017/06/30 全球购物
HTC VIVE美国官网:VR虚拟现实眼镜
2018/02/13 全球购物
数控技术与应用毕业生自荐信
2013/09/24 职场文书
护士个人自我鉴定
2014/03/24 职场文书
学生个人自我鉴定范文
2014/03/28 职场文书
2014年保育员工作总结
2014/12/02 职场文书
2014年社区个人工作总结
2014/12/02 职场文书