为什么给元素设置scrollTop不起作用? 您所在的位置:网站首页 jquery移动端滚动不了 为什么给元素设置scrollTop不起作用?

为什么给元素设置scrollTop不起作用?

2023-09-29 17:40| 来源: 网络整理| 查看: 265

今天要给一个元素添加一个向上滚动的效果,于是马上用到了scrollTop()。比如说是下面的页面结构:

#wrapper的高度是屏幕的可见高度,它在页面中不会随着页面的滚动而滚动。.scroll-fixed-count是#wrapper的子元素,它的高度很高,要远远超过#wrapper的高度。现在我想在某个事件触发之后,让.scroll-fixed-count向上移动100px,于是我用:

1

angular.element('.scroll-fixed-count').scrollTop(100)

  来实现,但问题是,并不能实现预期的效果,即实现如下的效果:

 

 不但不能实现如上的效果,我把页面手动滚上去一段距离,然后用:

1

angular.element('.scroll-fixed-count').scrollTop()

  来取它的scrollTop的值,也是0.

这里,之所以会出现这个问题,实际是对scrollTop的含义并没有搞清楚。实际上,scrollTop()方法返回或设置匹配元素的滚动条的垂直位置。什么意思呢?就是说,首先,这个元素必须本身有滚动条;如果这个元素本身没有滚动条,那么它的scrollTop()的值只会是0.就好像上面的例子,.scroll-fixed-count这个元素很长,但是它本身是没有滚动条的,所以无论你好像手动把它向上滚动了多少,它本身是没有滚动条的,有滚动条的是它的父元素#wrapper,要取也是取 angular.element('#wrapper').scrollTop() 。scrollTop指的是滚动条相对于其顶部的偏移。

总结一下,像上面这种情况,我要想将子元素.scroll-fixed-count向上滚动一些,我需要:

1、#wrapper具备滚动条;

2、设置#wrapper的overflow属性为auto或者scroll。如果不显示地设置这个属性,也不能实现。



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有