jQuery- Click to return to top

On the page, sometimes you need to click on an icon button to return to achieve top results.

Implementation follows the icon button to increase the class named goTop-hook.

 1 // 点击返回顶部
 2 $(window).scroll(function() {
 3   if ($(window).scrollTop() >= 100) {
 4     $(".goTop-hook").fadeIn(300)
 5   } else {
 6     $(".goTop-hook").fadeOut(300)
 7   }
 8 })
 9 
10 $(".goTop-hook").bind("click", function() {
11   $("html").animate({ scrollTop: 0 }, 300)
12 })

Elements of which are:

When 1.window slide, triggering scroll event, when scrollTop than 100px, fade icon button (FadeIn), or fade out (FadeOut).

2. When the icon is clicked the button, slowly back to the top scrollTop = 0.

3.300 unit of time, usually the default unit is ms.

 

 

Guess you like

Origin www.cnblogs.com/luoyihao/p/11977648.html