项目总结(1)
来源:互联网 发布:双色球算法必中6红球 编辑:程序博客网 时间:2024/06/13 07:06
这是项目中一段代码,然后看了半天,发现自己的基础是如此的薄弱,只能看懂个大概意思。
1.2使用JS代码控制html的font-size大小
然后我就又搜了var doc = document.documentElement..body是DOM对象里的body子节点,即body标签,documentElement 是整个节点树的根节点root.
body是DOM对象里的body子节点,即 <body> 标签;
documentElement 是整个节点树的根节点root,即<html> 标签;
接着我又搜了getBoundingClientRect()
getBoundingClientRect用于获取某个元素相对于视窗的位置集合。集合中有top, right, bottom, left等属性。
1.语法:这个方法没有参数。
rectObject = object.getBoundingClientRect();
2.返回值类型:TextRectangle对象,每个矩形具有四个整数性质( 上, 右 , 下,和左 )表示的坐标的矩形,以像素为单位。
rectObject.top:元素上边到视窗上边的距离;
rectObject.right:元素右边到视窗左边的距离;
rectObject.bottom:元素下边到视窗上边的距离;
rectObject.left:元素左边到视窗左边的距离;
示图:
3. 兼容性:我用ie11的Document Mode模式测试,ie5以上都能支持。
PC端:
Mobile端:
4.width和height:ie9以上支持width/height属性。
兼容ie6~ie8的width/height的写法:
var rectWidth = rectObject.right - rectObject.left; rectHeight = rectObject.bottom - rectObject.top;
5.在ie7及ie7以下left和top会多出两个像素。
ie7下测试:
chrome下测试:
在百度经验下找到document.documentElement在ie7及ie7以下会多出两个像素。为了搞明白document.documentElement是什么?我把它的tagName打印出来。
ie7下:
在ie7及ie7以下的html元素坐标会从(2, 2)开始算起,在ie8已经修复了这个bug。这就是多出两个像素的原因。下面我们做下兼容:
var rectLeft = rectObject.left - document.documentElement.clientLeft || 2; rectRight = rectObject.right - document.documentElement.clientLeft || 2; rectBottom = rectObject.bottom - document.documentElement.clientTop || 2; rectTop = rectObject.top - document.documentElement.clientTop || 2;
- 项目总结(1)
- 项目总结(1)
- 项目总结(1)
- 项目大总结(项目总结)
- 项目总结系列(1)-概述
- NotepadBaseOnJava项目总结与问题(1)
- Ant构建Java项目总结(1)
- 项目总结1
- 项目总结-1
- unity --项目总结-1
- 项目总结1
- 项目总结1
- 项目技术总结1
- 项目BUG总结1
- APP4Smarthome项目总结1
- 项目1失败总结
- 项目总结1
- 项目总结-1
- 想知道账号被封的感觉么?
- Java 使用NotePad++DIY一个IDE
- TopShelf+Quartz.net实现window定时调度服务
- 静态方法详解 静态类 静态属性的对比和具体应用
- Unity Shader常见指令和标签
- 项目总结(1)
- SQL语句优化,高效率SQL
- H.264 基础及 RTP 封包详解
- C#取三个数的最大值、最小值、平均值、中间值
- Which Android runs which Linux kernel? ( Android Version --- API Level --- Linux Kernel in AOSP )
- C++ primer 薄片系列之拷贝控制
- mysql主备
- Java通过反射获取自定义注解
- ubuntu下安装nginx服务器与设置开机自启动