display go-to-top button automatically

gistfile1.html

  
<style TYPE="text/css">
<!--
#go-to-top {
  display: none;
  position: fixed;
  right: 60px;
  bottom: 100px;
  padding: 18px;
  color: #666;
  background: #DDD;
  font: 36px/18px Helvetica,Arial,Verdana,sans-serif;
  opacity: 0.7;
  outline: 0 none;
  text-decoration: none;
  text-shadow: 0 0 1px #DDD;
  vertical-align: baseline;
  -moz-border-radius: 5px;
  -khtml-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
-->
</style>
  ...
<footer>  
    <a style="display: none; " rel="nofollow" href="#top" id="go-to-top">▲</a>
</footer>

go-to-top

$(function(){
  $("#go-to-top").click(function(){
      $("html, body").animate({'scrollTop': 0}, 400);
      return false;
  });
  $(window).scroll(function() {
      var top = $(document).scrollTop();
      var g = $("#go-to-top");
      if (top > 300 && g.is(":hidden")) {
          g.fadeIn();
      } else if(top < 300 && g.is(":visible")) {
          g.fadeOut();
      }
  });
})