原生JS滚动条位置处理
// 滚动条位置
var scrollPosition = {
// 位置
result: 0,
// 监听位置
rememberPosition: function () {
var type = 'scroll'
var handle = function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
scrollPosition.result = scrollTop
}
if (window.addEventListener) {
window.addEventListener(type, handle, false)
}
if (window.attachEvent) {
window.attachEvent('on' + type, handle)
}
},
// 设置位置
setPostion: function () {
window.scrollTo(document.body.scrollWidth, scrollPosition.result)
}
}
原生JS滚动条位置处理的更多相关文章
- 原生js和jquey获取窗口宽高,滚动条,鼠标位置总结
JQuery获取浏览器窗口的可视区域高度和宽度,滚动条高度 alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height( ...
- 原生JS获取各种高度宽度、浏览器窗口滚动条的位置、元素的几何尺寸名
1)关于 pageX, clienX,offsetX,layerX pageX:鼠标在页面上的位置,从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化 clientX:鼠标在页面上可视区域的位 ...
- html通过css,js实现div悬浮效果总汇,如原生JS实现滚动到一定位置实现div悬浮
在我们的实际开发中,经常会遇到页面中需要悬浮效果,比如最早的客服联系,对联悬浮广告等,今天为大家介绍一些如何实现div悬浮的效果. 传统的fixed实现: 通过css中的属性position参数设为f ...
- 原生js实现滚动条
var SimulateScroll = (function(){ var oParent = document.getElementById('wrap-scroll-bar'), oBox = d ...
- js设置滚动条位置
JS控制滚动条的位置: window.scrollTo(x,y); 竖向滚动条置顶(window.scrollTo(0,0); 竖向滚动条置底 window.scrollTo(0,document.b ...
- 原生js来写获取元素距离顶部距离,以及滚动条滚动指定距离和时间控制
这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...
- 原生JS 和 JQ 获取滚动条的高度,以及距离顶部的高度
JQ:相对比较简便 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 ...
- 原生js实现随着滚动条滚动,导航会自动切换的效果
最近学习前端,把前面用原生js写的一段有关tab切换效果的代码贴上,实现的效果比较简陋,请大家见谅 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
- 原生js--兼容获取窗口滚动条位置和窗口大小的方法
各个浏览器对获取获取窗口滚动条位置和窗口大小没有提供统一的API,以下是对其封装,解决兼容性问题 /** * 获取浏览器视口的大小(显示文档的部分) * */function getViewPort ...
随机推荐
- 《Effective Java》读书笔记 - 10.并发
Chapter 10 Concurrency Item 66: Synchronize access to shared mutable data synchronized这个关键字不仅保证了同步,还 ...
- 第三周课程总结&实验报告(一)
实验报告(一) 1.打印输出所有的"水仙花数",所谓"水仙花数"是指一个3位数,其中各位数字立方和等于该数本身.例如,153是一个"水仙花数" ...
- 添加tomcat为启动服务/删除tomcat服务
在很多生产把环境下,tomcat的启动要随着windows的启动一起启动,这个时候就需要将tomcat添加成服务.步骤如下: 1:环境配置 配置jdk环境变量: JAVA_HOME:jdk路径 配置p ...
- jenkins不展示set Build Description Setter插件
问题描述: 1.jenkins 已下载 set build descripteion ,并且配置过,可以在构建历史中展示就用二维码 2.问题:构建历史中不展示二维码了,如图: 总是排查: 1.首先想到 ...
- SAAS方法论
内容来源:https://12factor.net/ 如今,软件通常会作为一种服务来交付,它们被称为网络应用程序,或软件即服务(SaaS).12-Factor 为构建如下的 SaaS 应用提供了方法论 ...
- Kolla 让 OpenStack 部署更贴心
目录 目录 Kolla 简介 Kolla & Kolla-ansible 部署 OpenStack 准备操作系统基础环境 准备 Python 基础环境 准备 Docker 基础环境 安装 ko ...
- diff()函数
1 diff()是将原来的数据减去移动后的数据. 在numpy和pandas中都能调用. pandas的调用方法: import pandas as pd df = pd.DataFrame( {'a ...
- JVM监控工具之JProfiler
一.简介 JProfiler是一款Java的性能监控工具.可以查看当前应用的对象.对象引用.内存.CPU使用情况,线程运行情况(阻塞.等待等),同时可以查找哪个对象占用的内存比较多.哪个对象占用CPU ...
- selenium:css_selector定位详解(css selector和xpath的比较)
selenium使用css selector和xpath的比较 selenium提供的定位方式(常用) ID NAME CLASS CSS SELECTOR XPATH 推荐的定位方式的优先级 优 ...
- vue+sentry 前端异常日志监控
敲代码最糟心不过遇到自己和测试的环境都OK, 客户使用有各种各样还复现不了的问题,被逼无奈只能走到这一步:前端异常日志监控! vue官方文档如下推荐: 就是说, vue有错误机制处理errorHand ...