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

2019-12-17,,,

本文实例讲述了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>

PS:这里再为大家推荐一款非常好用的JavaScript压缩、格式化与加密工具,功能非常强大:

JavaScript压缩/格式化/加密工具:http://tools.jb51.net/code/jscompress

上面这款js工具中的加密功能可实现js代码的eval函数加密形式,对此本站还提供了如下这款针对eval函数加密的解密工具,非常强大实用!

js的eval方法在线加密解密工具:http://tools.jb51.net/password/evalencode

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

您可能感兴趣的文章:

  • 基于JS判断iframe是否加载成功的方法(多种浏览器)
  • JavaScript编写检测用户所使用的浏览器的代码示例
  • js根据手机客户端浏览器类型,判断跳转官网/手机网站多个实例代码
  • JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
  • 详解javascript跨浏览器事件处理程序
  • js事件处理程序跨浏览器解决方案
  • Js与Jq获取浏览器和对象值的方法
  • 浏览器检测JS代码(兼容目前各大主流浏览器)
  • 基于JavaScript判断浏览器到底是关闭还是刷新(超准确)
  • 浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
  • 浏览器环境下JavaScript脚本加载与执行探析之defer与async特性
  • js阻止浏览器默认行为的简单实例

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

下载本文的Word格式文档,以方便收藏与打印。