最近想用原生js实现一些交互效果,以下代码是返回顶部按钮要用到的一个方法:获取和设置页面垂直滚动高度,如果用jq可以简单实现,用原生js,其实就是要多考虑浏览器的兼容性:

/*** 获取&&设置-页面垂直滚动值* */function __getPageScrollY(top) {if (top || Number(top) == 0) { //设置垂直滚动值if (self.pageYOffset) {self.pageYOffset = Number(top);}if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strictdocument.documentElement.scrollTop = Number(top);}if (document.body) {// all other Explorersdocument.body.scrollTop = Number(top);}return true;} else { //获取垂直滚动值var yScroll;if (self.pageYOffset) {yScroll = self.pageYOffset;} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 StrictyScroll = document.documentElement.scrollTop;} else if (document.body) {// all other ExplorersyScroll = document.body.scrollTop;}return yScroll;}};

调用:

var scrollHeight = __getPageScrollY();//获取高度__getPageScrollY(1000);//设置高度

原生js获取和设置页面垂直滚动高度相关推荐

  1. 原生JS基于window.scrollTo()封装垂直滚动动画工具函数

    概要: 原生JS基于window.scrollTo()封装垂直滚动动画工具函数,可应用与锚点定位.回到顶部等操作. ####封装原因: 在vue项目中,遇到需要实现垂直滚动效果的需求,初步想到的方法有 ...

  2. js获取浏览器窗口页面宽度、高度的方法 kaki 的博客

    js获取浏览器窗口页面宽度.高度的方法 不多说,直接上代码 alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()) ...

  3. 怎么修改html行内样式表,原生JS获取及设置CSS样式-1.行内样式

    面试中,应该会经常被问到样式的写法以及如何使用原生JS获取及操作样式的问题吧,让我给大家总结一下~ HTML中样式的写法不外乎以下四种方式 行内样式 假装有内容 head内部样式 div { widt ...

  4. js取iframe 上级页面_原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法...

    用原生js在父页面获取iframe子页面的元素,以及在子页面获取父页面元素,这是平时经常会用到的方法,这里写一个例子来总结下: 1.父页面(demo.html),在父页面修改子页面div的背景色为灰色 ...

  5. 原生js获取以固定字符开头的控件id,并设置属性

    原生js获取以固定字符开头的控件id,并设置属性 还在用JQ加CSS选择器获取指定id开头的DOM嘛? 现在试试 JavaScript提供的querySelectorAll函数 目前几乎主流浏览器均支 ...

  6. 原生js获取宽高与jquery获取宽高的方法的关系

    说明:1.因为获取高度的情况跟获取宽度的情况一样,所以以下只说获取宽度的情况.  2.以下所说的所有方法与属性所返回的值都是不带单位的.  3.为了方便说明,以下情况采用缩写表示:  obj -> ...

  7. 原生js获取一段时间内每隔几分钟的时间数组

    姊妹篇 原生js获取一段时间内每隔几天的时间数组 情况: 项目中有这么一个需求,输入开始时间.结束时间.时间间隔,获取一段时间内每隔几分钟的时间数组 接下来我必须现在网上找找有没有类似的稍微改改就好了 ...

  8. js 获取dom离页面编剧_页面对象之外:具有宁静性和编剧模式的下一代测试自动化

    js 获取dom离页面编剧 在当今快节奏的软件交付世界中,自动化的验收测试至关重要. 一组高质量的自动验收测试可帮助您减少浪费在手动测试和修复错误上的时间,从而更快地交付有价值的功能. 与行为驱动开发 ...

  9. 通过js获取PHP设置的cookie(全实例讲解)

    制作网页我们通常都要做一个登陆界面,如果对于不是安全性要求很高的网站,这个登录界面我我们当然不希望频繁输入账户密码来验证身份,我们想要的是只要一次验证,就可以长时间保持登陆状态. session虽然可 ...

最新文章

  1. 深入了解EJB (一) EJB在java世界的地位
  2. SQL server 两台服务器间连接查询
  3. C# 学习笔记(5) 继承
  4. 【学术相关】考研生对导师“嚣张发言”引热议:希望您今年招个女同学,不然我换导师!...
  5. Unity的Flutter——UIWidgets简介及入门
  6. 数据可视化demo_为更快读懂报表,我们将数据可视化了
  7. LeetCode - Maximum Subarray
  8. pythonlist排序算法_Python版常见的排序算法
  9. android网络框架
  10. 仓库货位卡标识牌_仓库应如何规划?
  11. 团队作业4——第一次项目冲刺(Alpha版本)4.23
  12. Broadcast receiver之我见
  13. keepalived java,keepalived+nginx+tomcat高可用负载均衡
  14. 万能显卡驱动win7_驱动工具更新!完美支持苹果电脑驱动
  15. eplan p8详细安装步骤文库_Win10系统安装Eplan Electric P8详细步骤
  16. SQL Server 【不允许保存更改】问题解决图解
  17. Java+HTML预习笔记_20140610
  18. 如何用Python操作PDF制作数据报告?
  19. 移动端网站设计需要注意的四要点
  20. 量化中获取A股交易日信息

热门文章

  1. 优信拍集团php面试题_7.46亿元!优信拍说卖就卖!二手车市场变局横生
  2. 使用svg自定义图标
  3. Python3极速入门
  4. 快手视频伪原创工具 视频怎么修改m5d
  5. SearchUI线程关闭微软小娜占用CPUWindows家庭版关闭微软小娜
  6. Python 基础合集11:文件读写
  7. 怎么把WPS转换成PDF的操作方法
  8. 银杏树Python画图
  9. 人人商城互动直播使用指南(阿里云服务器、宝塔环境)
  10. 小白文章————在线考试系统