This is my Blog!!Welcome to you!!
【分享个人java学习心得和技术问题汇总】

js返回顶部

效果如下

http://dnf.yq1012.com/geyi/

js+JQuery实现返回顶部功能

很多网站上都有返回顶部的效果,本文阐述如何使用jquery实现返回顶部按钮。

首先需要在顶部添加如下html元素:

其中a标签指向锚点top,可以在顶部防止一个<a name="top"></a>的锚点,这样在浏览器不支持js时也可以实现返回顶部的效果了。

要想让返回顶部的图片显示在右侧,还需要一些css样式,如下:

  

上面样式中的背景图片是雪碧图,下面提供两个单独的返回顶部图片方便朋友们使用:

go-top-icon go-top-icon2go-top-light-green go-top-green go-top-yellow

有了html和样式,我们还需要用js控制返回顶部按钮,在页面滚动时渐隐渐现返回顶部按钮。


来自  http://www.cnblogs.com/yukaizhao/archive/2012/12/02/js-go-top-function.html

未经允许不得转载:Java学习 » js返回顶部

分享到:更多 ()