一、元素的 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. ASPxGridView 下拉框不让输入

     DropDownStyle="DropDownList"该属性使combox控件不能手动输入数据,只能在下拉列表中选择

  2. 开源linux远程登录、远程文件管理（ftp）工具

    ssh远程登录用 PuTTY.Xshell 5 如果觉得命令行下敲命令管理文件麻烦,就用WinSCP.FileZilla Client(SSH模式),可做到文件上传.下载.改权限等等,很便捷

  3. linux防火墙添加端口

     防火墙配置文件: /etc/sysconfig/iptables 1.使用命令查看端口开启情况(下图为安装时未选择开启防火墙) [root@fullstack ~]# iptables -L -n ...

  4. ORA-01950:no privileges on tablespace 'USERS'

    ORA-01950:no privileges on tablespace 'USERS' SQL>create user myuser identitied by password; SQL& ...

  5. TreeMap读源码总结

    红黑树: 定义 A red–black tree is a kind of self-balancing binary search tree in computer science. Each no ...

  6. Spring Boot如何初始化数据

    Hibernate机制:classpath下的import.sql,l在ddl-auto是create和create-drop时自动执行,如果ddl-auto设置为update就不合适,所以此选项不适 ...

  7. Modbus协议学习笔记

    之前也有写过基于 Modbus 通讯协议的控制远程监控程序,但是由于当时时间赶.人手少(软硬件前后台都是在下一人

  8. ajax 工作原理以及其优缺点

    1.什么是AJAX?AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是一种创建交互式网页应用的网页开发技术.它使用:使用XHTML ...

  9. my01_Mysql router 安装

    Mysql router 主要用途是读写分离,主主故障自动切换,负载均衡,连接池等.安装如下 下载地址:https://dev.mysql.com/downloads/router/ tar -zxv ...

  10. Apache重定向URL

    (1)去除httpd.conf文件中"#LoadModule rewrite_module modules/mod_rewrite.so"前面的"#"号; (2 ...