Gotop 在某些網頁向下滾動後出現在右下角，
點一下之後會回到最上面。

先來做出一個隨著畫面的滾動仍然固定在右下角的區塊，

<div class="ui-gotop">top</div>

.ui-gotop {
  position: fixed;
  bottom: 15px;
  right:15px;
  width: 40px;
  height: 40px;
  background-color: #7f8492;
  text-align: center;
  color: #fff;
}

先讓他隱藏起來
所以我要加上

display: none;

接著希望他在往下滾動100px 後
可以顯示

$(window).scroll(function() {
  var h = $(window).scrollTop();  //取得捲動的距離(與top的距離)
  if (h > 100) {
    $('.ui-gotop').css('display', 'block');
  }  //如果距離大於100時 將ui-gotop這個改為 display: block
  else {
    $('.ui-gotop').css('display', 'none');
  }  //除此之外，也就是小於100時，display: none
})

最後要加上點擊能夠回到頂端的功能

$('.ui-gotop').click(function() {
  //點擊ui-gotop之後
  $('html,body').animate({
    scrollTop: 0
  }, 'fast');  //回到0的位置
})

就能再click之後 回到頂端了!!!