scrollTop总是为0

如图,需要实现类似阅读完整个协议之后,我接受这个按钮才能被点击。

第一反应想到的是监听滚动,scroll

美滋滋的绑定事件,然后判断 : 滚动的距离大于内部的高度减去外部的高度的时候就视为到达底部

scrollTop + divHeight >= scrollHeight

这里scrollTop指的是滚动的距离,可以理解为滚动条距离顶部的距离,

divHeight是父元素的高度,想要在父元素里滚动,当然子元素高度要大于父元素。

scrollHeight就是子元素的高度了

嗯,一切都很顺利,当到达底部的时候按钮被激活,隐藏这个协议框,然后继续下一步操作。

当我再次进这个页面的时候发现,协议还是在底部。导致这个问题有几个原因:

1.因为这个页面的协议是需要实时获取的,也就是每进一次这个页面我都需要去查询一下协议然后展示在协议框。

2.用户关闭协议框有两种可能,一是阅读完之后也就是滚动条下滑到底部之后,这时点击我已阅读是关闭协议框。二是用户之后点击叉叉。

现在问题发生的情况是在用户阅读完之后,再次进入这个页面时协议没有回到顶部。导致scrolltop一直是0,无法响应事件。

我以为是再次拉取协议数据的时候没有清空子元素的内容,然而并不是这个影响的,dom节点是重新渲染的。我一直以为只要节点重新渲染,

滚动距离就会自动重置即回到顶部。

解决方案:在我关闭协议框的时候,使用$(_pageId + ".allnewsin-side").scrollTop(0);手动让它滚动到顶部。然后。。。。就解决了。。。

本人不明白的地方:

滚动条的高度是父元素的属性吗?滚动条的长度是由内部子元素决定的,照理来说我改变子元素的内容,滚动条应该重置。然而并没有,是不是可以理解为其实

是作用在父元素上的

时间: 2024-10-31 13:37:44

scrollTop总是为0的相关文章

scrollTop值为0等疑难杂症

IE6/7/8/9/10: 对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度 : 对于有doctype声明的页面则可以使用 document.documentElement.scrollTop : Safari: safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset : Firefox: 火狐等等相对标准些的浏览器就省心多了,直接用 document.documentElem

火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.onscroll=function () { var oId=document.getElementByIdx_x("id"); oId.style.top=document.body.scrollTop+"px"; } 可是怎么没有达到预期效果呢,输出document.b

vue滚动scrollTop 赋值一直为0

每次打印scrollTop都为0: 百度了很多,大概说的都是DTD声明问题 几经周折发现一篇不错的 https://www.jb51.net/article/153196.htm 最后检查发现,此时滚动条在父级上,直接为父级赋值高度即可 原文地址:https://www.cnblogs.com/tylz/p/11686819.html

document.documentElement.scrollTop

要获取当前页面的滚动条纵坐标位置, 用:      document.documentElement.scrollTop; 而不是:      document.body.scrollTop; documentElement 对应的是 html 标签,而 body 对应的是 body 标签. 在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替    如果你想定位鼠标相对于页面的绝对位置时,你会发现

使用原生js的scrollTop,刷新进入页面定位到某一个dom元素

原生js的scrollTop即可,与jquery方法的区别是jquery做了兼容封装.我想要实现的功能是时间定位,根据当前时间定位到滚动区的时间位置.页面为移动端页面,上下固定位置,中部为1小时4格的选择区域,从0点到24点. 开始我想发出现了偏差,总想定位到某个dom,这样使得scrollTop一直是0,怎么设置都不行,后来仔细分析才发现要设置在超出当前可视区域的dom上才可以. 所以设置在外层overflow-x:scroll;的dom上即可,根据时间匹配dom位置,根据索引及每格的高度计算

JS之scrollTop详解

1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有doctype声明的页面则可以使用 document.documentElement.scrollTop: Safari: safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset : Firefox: 火狐等等相对标准些的浏览器就省心多了,直接用 docum

IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight

IEdocument.documentElement.scrollHeight  浏览器所有内容高度 ,document.body.scrollHeight  浏览器所有内容高度document.documentElement.scrollTop  浏览器滚动部分高度,document.body.scrollTop 始终为0document.documentElement.clientHeight  浏览器可视部分高度,document.body.clientHeight  浏览器所有内容高度

top:expression(eval(document.documentElement.scrollTop));

top:定义元素顶部在页面中的位置: expression:css中引用javascript的属性: document.documentElement.scrollTop:页面滚动条纵向位置坐标(documentElement是对于html标签,针对body标签的是body). ps--外话一句,在加了DTD的标准化W3C下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop代替(ie和firefox确实如此).但是我

关于scrollTop的兼容问题

1.各浏览器下 scrollTop的差异 IE6/7/8: 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 : 对于有doctype声明的页面则可以使用 document.documentElement.scrollTop: Safari: safari 比较特别,有自己获取scrollTop的函数 : window.pageYOffset : Firefox: 火狐等等相对标准些的浏览器就省心多了,直接用 docum