一、元素的 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的运动）的更多相关文章

  1. 从零开始的全栈工程师——html篇1

    全栈工程师也可以叫web 前端 H5主要是网站 app 小程序 公众号这一块 HTML篇 html(超文本标记语言,标记通用标记语言下的一个应用.) “超文本”就是指页面内可以包含图片.链接,甚至音乐 ...

  2. 从零开始的全栈工程师——html篇1.2

    起名方式与CSS 一.起名方式(起名方式也叫选择器) 起名的目的是为了给标签添加属性 常见的3种选择器有 标签选择器   id选择器(使用的时候加#)    class选择器(使用的时候加.) 样式的 ...

  3. 从零开始的全栈工程师——html篇1.8（知识点补充与浏览器兼容性）

    知识点补充 一.浏览器的兼容问题(关于浏览器的兼容问题 有很多大佬已经解释的很清楚了 这个得自己百度去多花点时间去了解 这里咱们只说一下前面的漏点) 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题 ...

  4. 从零开始的全栈工程师——html篇1.7

    position定位与表单 一.position 1.Position细说 Position:relative; Left:100px; Top:100px; Position:absolute; L ...

  5. 从零开始的全栈工程师——html篇1.5

    列表与边距探讨和行块 一.列表 1.无序列表(UL) 1)内部必须有子标签<li></li>2)天生自带内外边距 p也是自带 大家会发现用UL的时候内容前面会出现一个像这样的一 ...

  6. 从零开始的全栈工程师——html篇1.4

    背景与边框 一.背景(backgound) 1.背景颜色:background-color:red;(简写:background:color;) 备注:ie9以下给body设置background-c ...

  7. 从零开始的全栈工程师——html篇1.3

    文本.字体css样式与前期英语单词汇总 一.文本样式(text) 1.颜色:color:red; 2.文本对齐方式:text-align:left/center/right/justify; left ...

  8. 从零开始的全栈工程师——PHP篇 ( 单词汇总 ) ( php解决文字乱码 )

    解决乱码: header("Content-Type: text/html;charset=utf-8"); 单词 局部的: local 全局的: global 静态的: stat ...

  9. 从零开始的全栈工程师——html篇1.6

    浮动与伪类选择器 一.浮动(float) 1.标准文档流 标准文档流是一种默认的状态 浏览器的排版是根据元素的特征(块和行级) 从上往下 从左往右排版 这就是标准文档流 2.浮动(float)floa ...

  10. 从零开始的全栈工程师——js篇2.1（js开篇）

    JS开篇 一.js介绍 全称 javascript 但不是java 他是一门前台语言 而java是后台语言js作者 布兰登·艾奇 前台语言:运行在客户端的后台语言:跟数据库有关的 能干什么?    页 ...

随机推荐

  1. uoj#420. 【集训队作业2018】矩形（组合数学）

    题面 传送门 题解 这辣鸡题目做了咱整整三天--咱果然还是太菜了--好珂怕的推倒啊-- 首先把它变成 \[\left( \sum_{i = 1}^{n} \sum_{j = 1}^{m} F(i, j ...

  2. v-touch使用方法以及在项目中遇到的问题

    上篇博客中我记得还有一个坑没有解决好,在这篇博客中详细说明一下. 在 https://github.com/dreamITGirl/vuepageturn 我的这个代码库里,更新到2.1版本. 目前解 ...

  3. Jmeter解决乱码问题

    一.设置编码方式utf-8并勾选编码 适用场景:参数中含有中文或乱码 二.增加beanshell脚本 添加BeanShell PostProcessor或者BeanShell Sampler,输入代码 ...

  4. C++11 特性：成员函数引用限定 （Reference qualifier）

    学了这么多年C++今天拜读scott meyes的more effective cpp第一次看到这种写法... 引用限定可以让成员函数只能被左值对象调用或者只能被右值对象调用: #include &l ...

  5. Java Applet 素数小程序

    en... 1. Applet 这个远古的东西,今天我同学让我帮他看看代码,说applet运行出错.额,反正闲着也是闲着,看看呗 ,结果看到代码...4 2.就是实现这破玩意 package calc ...

  6. php 中 ?? 和 empty 的 区别

    left??right  操作符...当 left 为空时 返回 right ..注意 和 empty 相比 ,空字符,0,'0' 都会返回它本身,而不是 右边的..也就是 当且仅当 没有设置变量或者 ...

  7. 设置IIS，使客户端访问服务器上的文件

    1.打开IIS控制器——"运行-cmd-inetmgr-回车“ 2.选中要设置的网站 3.右键,添加虚拟目录 4.如上图所示,在别名处输入文件目录的名称,物理路径要选择文件在磁盘上的存储根目 ...

  8. CodeForces - 124B-Permutations(DFS)

    You are given n k-digit integers. You have to rearrange the digits in the integers so that the diffe ...

  9. shell入门基础必备

    作者:KornLee 2005-02-03 15:32:57 来自:Linux先生    1.建立和运行shell程序   什么是shell程序呢? 简单的说shell程序就是一个包含若干行 shel ...

  10. /proc下重要路径知识

    /proc 虚拟目录,是内存的映射,内核与进程的虚拟文件系统目录/proc/version 内核版本/proc/sys/kernel 系统内核功能/proc/sys/net/ipv4*/proc/cp ...