从零开始的全栈工程师——js篇2.18（js的运动）
一、元素的 client offset scroll 三个系列
clientWidth / clientHeight / clientTop / clientLeft
offsetWidth / offsetHeight / offsetLeft / offsetTop / offsetParent
scrollWidth / scroHeight / scrollTop / scrollLeft
这十三个属性 前面十一个是只读属性 scrollTop和scrollLeft是既可读也可写
测试滚动条的距离
返回Y轴window.pageYOffset
返回X轴window.pageXOffset
获取整个文档的高：
document.body.scrollHeight || document.documentElement.scrollHeight
获取浏览器一屏幕的高（浏览器的可视区）：
document.body.clientHeight || document.documentElement.clientHeight
二、window下的两个事件
onscroll 当滚动条滚动的时候出发
onresize 当窗发生改变时触发
三、让滚动条滚动
window.scroll（x，y） 不累加
window.scrollTo（x，y） 跟上面一样
window.scrollBy（x，y） 会累加
从零开始的全栈工程师——js篇2.18（js的运动）的更多相关文章
- 从零开始的全栈工程师——html篇1
全栈工程师也可以叫web 前端 H5主要是网站 app 小程序 公众号这一块 HTML篇 html(超文本标记语言,标记通用标记语言下的一个应用.) “超文本”就是指页面内可以包含图片.链接,甚至音乐 ...
- 从零开始的全栈工程师——html篇1.2
起名方式与CSS 一.起名方式(起名方式也叫选择器) 起名的目的是为了给标签添加属性 常见的3种选择器有 标签选择器 id选择器(使用的时候加#) class选择器(使用的时候加.) 样式的 ...
- 从零开始的全栈工程师——html篇1.8（知识点补充与浏览器兼容性）
知识点补充 一.浏览器的兼容问题(关于浏览器的兼容问题 有很多大佬已经解释的很清楚了 这个得自己百度去多花点时间去了解 这里咱们只说一下前面的漏点) 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题 ...
- 从零开始的全栈工程师——html篇1.7
position定位与表单 一.position 1.Position细说 Position:relative; Left:100px; Top:100px; Position:absolute; L ...
- 从零开始的全栈工程师——html篇1.5
列表与边距探讨和行块 一.列表 1.无序列表(UL) 1)内部必须有子标签<li></li>2)天生自带内外边距 p也是自带 大家会发现用UL的时候内容前面会出现一个像这样的一 ...
- 从零开始的全栈工程师——html篇1.4
背景与边框 一.背景(backgound) 1.背景颜色:background-color:red;(简写:background:color;) 备注:ie9以下给body设置background-c ...
- 从零开始的全栈工程师——html篇1.3
文本.字体css样式与前期英语单词汇总 一.文本样式(text) 1.颜色:color:red; 2.文本对齐方式:text-align:left/center/right/justify; left ...
- 从零开始的全栈工程师——PHP篇 ( 单词汇总 ) ( php解决文字乱码 )
解决乱码: header("Content-Type: text/html;charset=utf-8"); 单词 局部的: local 全局的: global 静态的: stat ...
- 从零开始的全栈工程师——html篇1.6
浮动与伪类选择器 一.浮动(float) 1.标准文档流 标准文档流是一种默认的状态 浏览器的排版是根据元素的特征(块和行级) 从上往下 从左往右排版 这就是标准文档流 2.浮动(float)floa ...
- 从零开始的全栈工程师——js篇2.1（js开篇）
JS开篇 一.js介绍 全称 javascript 但不是java 他是一门前台语言 而java是后台语言js作者 布兰登·艾奇 前台语言:运行在客户端的后台语言:跟数据库有关的 能干什么? 页 ...
随机推荐
- HDU6312 Game (多校第二场1004) 简单博弈
Game Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- maven 更新子工程中依赖的父工程 版本
eclipse 中: versions:update-child-modules cmd: mvn versions:update-child-modules
- linux防火墙添加端口
防火墙配置文件: /etc/sysconfig/iptables 1.使用命令查看端口开启情况(下图为安装时未选择开启防火墙) [root@fullstack ~]# iptables -L -n ...
- 【笔记】如何在for语句中迭代多个可迭代对象
并行=>使用内置函数zip,它能将多个可迭代对象合并,每次迭代返回一个元组. for i,j,k in zip(a,b,c): TODO 穿行=>使用标准库中的itertools.chai ...
- Web项目HttpContext.Current 为空
项目中,用到了WCF Service服务,用的是Windows身份验证,正常登陆后 HttpContext.Current=null 解决方法—— 1.在Web.config文件中添加配置项 < ...
- 4 Values whose Sum is 0（枚举+二分）
The SUM problem can be formulated as follows: given four lists A, B, C, D of integer values, compute ...
- 江西财经大学第一届程序设计竞赛 I
链接:https://www.nowcoder.com/acm/contest/115/I来源:牛客网 题目描述 小P和小Q是好朋友,今天他们一起玩一个有趣的游戏. 他们的初始积分都为1,赢的人可以将 ...
- js删除数组中的 "NaN"
[注意] js中的NaN不和任何值相等,包括自身 所以可以使用 x!=x 来判断x是否是NaN,当且仅当x为NaN时,表达式的结果为true NaN != NaN ; //true 可以依此删除数组中 ...
- How to Setup MySQL (Master-Slave) Replication in CentOS
The following tutorial aims to provide you a simple step-by-step guide for setting up MySQL (Master- ...
- div css 伪类 不固定图片大小 居中， css div 实现三角形
div css 伪类 不固定图片大小 居中 <style> .pic_box{width:300px; height:300px; background-color:#beceeb; fo ...