Heim > Web-Frontend > js-Tutorial > jquery scrollTop方法根据滚动像素显示隐藏顶部导航条_jquery

jquery scrollTop方法根据滚动像素显示隐藏顶部导航条_jquery

WBOY
Freigeben: 2016-05-16 17:33:10
Original
1979 Leute haben es durchsucht

本文使用jquery的scrollTop方法监视页面垂直滚动像素,并根据像素隐藏或者显示顶部的导航条。
效果预览网址:http://www.keleyi.com/keleyi/phtml/scrolloversee.htm

scrollTop的介绍:

语法
$(selector).scrollTop(offset)

参数
offset
描述
可选。规定相对滚动条顶部的偏移,以像素计。

定义和用法
scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。
scroll top offset 指的是滚动条相对于其顶部的偏移。
如果该方法未设置参数,则返回以像素计的相对滚动条顶部的偏移。

提示和注释
注释:该方法对于可见元素和不可见元素均有效。
注释:当用于获取值时,该方法只返回第一个匹配元素的 scroll top offset。
注释:当用于设置值时,该方法设置所有匹配元素的 scroll top offset。

附完整代码,保存到html文件,打开可以体验效果:

复制代码 代码如下:




监视滚动像素,显示或隐藏顶部导航条-柯乐义





请滚动鼠标使页面向下

www.keleyi.com

欢迎

hi

柯乐义

keleyi.com

keleyi

keleyi.com

柯乐义

柯乐义 监视下滚像素

A

jquery


keleyi.com

完整代码




Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage