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>
js根据浏览器窗口大小实时改变网页文字大小的更多相关文章
- 用javascript动态改变网页文字大小
<script>function setFontSize(size){document.getElementById('bottom').style.fontsize=size+'pt'; ...
- JS 获取浏览器窗口大小
JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...
- JS 获取浏览器窗口大小clientWidth、offsetWidth、scrollWidth
常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if (windows.innerWidth) winWidth = windows.innerWidth; else if ((docume ...
- js获取浏览器窗口大小
摘抄:https://blog.csdn.net/qq_27628085/article/details/81947478 常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if ...
- JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- js | javascript实现浏览器窗口大小被改变时触发事件的方法
转载 当浏览器的窗口大小被改变时触发的事件window.onresize 为事件指定代码: 代码如下: window.onresize = function(){ } 例如: 浏览器可见区域信息: 代 ...
- JS 获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- 函数语法:JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度(转载)
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- javascript实现浏览器窗口大小被改变时触发事件的方法
转载 当浏览器的窗口大小被改变时触发的事件window.onresize 为事件指定代码: 复制代码代码如下: window.onresize = function(){ } 例如: 浏览器可见区域信 ...
随机推荐
- Ubuntu下配置samba实现文件夹共享
转自:http://www.cnblogs.com/phinecos/archive/2009/06/06/1497717.html 一. samba的安装: sudo apt-get insall ...
- java 访问 usb
java 要访问 usb 设备,通常要自己写c/c++代码,然后再用 java 访问这些组件,以达到控制usb设备的目的.但现在有一个开源组件 libusb 帮我们做好了访问usb设备的封装(包括wi ...
- vector 之删除元素
删除指定位置的元素 删除vector中第5个位置的元素 vector<int> vec; //执行vector初始化操作 vector<; //获取第五个元素的iterator ve ...
- Codeforces Round #229 (Div. 2) C. Inna and Candy Boxes 树状数组s
C. Inna and Candy Boxes Inna loves sweets very much. She has n closed present boxes lines up in a ...
- Hibernate入门案例 增删改
一.Hibernate入门案例剖析: ①创建实体类Student 并重写toString方法 public class Student { private Integer sid; private I ...
- 【Debug 报异常】Debug打断点报错
用DEBUG启动项目,项目中打断点的,然后会报异常 解决方法: 第一步: 项目-->Java编译器-->Classfile Generation 复选框 全部勾选 第二步: 替换当前文件运 ...
- idea 使用
1.idea对maven的兼容性优于eclipse,idea对于程序内部管理是模块,个人感觉也是优于eclipse. 2.idea默认设置编辑器字体是比较差的. 可以参考文章 http://www.3 ...
- 使用maven 如何生成源代码的jar包
http://hw1287789687.iteye.com/blog/1943157
- [转]Modernizr的介绍和使用
转载自:http://blog.chinaunix.net/uid-21633169-id-4286857.html 传统浏览器目前不会被完全取代,令你难以将最新的 CSS3 或 HTML5 功能嵌入 ...
- ACM ICPC 2015 Moscow Subregional Russia, Moscow, Dolgoprudny, October, 18, 2015 G. Garden Gathering
Problem G. Garden Gathering Input file: standard input Output file: standard output Time limit: 3 se ...