JS根据浏览器窗口大小实时动态改变网页文字大小的方法
作者:bea
本文实例讲述了JS根据浏览器窗口大小实时动态改变网页文字大小的方法。分享给大家供大家参考,具体如下: 目前,有了css3的rem,给我们的移动端开发带来了前所未有的改变,使得我们的开发更容易,更易兼容很多设备,但这个不在本文讨论的重点中,本文重点说说如何使用js来实时改变网页文字的大小。 代码如下: <script> /* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */ function p
本文实例讲述了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./code/jscompress
上面这款js工具中的加密功能可实现js代码的eval函数加密形式,对此本站还提供了如下这款针对eval函数加密的解密工具,非常强大实用!
js的eval方法在线加密解密工具:http://tools./password/evalencode
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
有用 | 无用
目前,有了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./code/jscompress
上面这款js工具中的加密功能可实现js代码的eval函数加密形式,对此本站还提供了如下这款针对eval函数加密的解密工具,非常强大实用!
js的eval方法在线加密解密工具:http://tools./password/evalencode
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- jquery插件之文字间歇自动向上滚动效果代码
- jQuery插件ImageDrawer.js实现动态绘制图片动画(附源码下载)
- 利用jQuery中的ajax分页实现代码
- Jquery zTree 树控件异步加载操作
- jquery插件jquery.dragscale.js实现拖拽改变元素大小的方法(附demo源码下载)
- js判断图片加载完成后获取图片实际宽高的方法
- JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
- jquery zTree异步加载简单实例讲解
- JavaScript代码因逗号不规范导致IE不兼容的问题
- jquery插件jquery.LightBox.js实现点击放大图片并左右点击切换效果(附demo源码下载)
- JQuery ztree带筛选、异步加载实例讲解
- jquery ztree实现模糊搜索功能
- jQuery实现从身份证号中获取出生日期和性别的方法分析
- jquery实现列表上下移动功能
- js简单判断移动端系统的方法
- jquery ztree实现树的搜索功能
- jquery ztree异步搜索(搜叶子)实践
- JQuery ztree 异步加载实例讲解
- Node.js编写组件的三种实现方式