Tuesday, 20 November 2012

JQUERY FOR GO TO TOP SCROLL

<html>
<head >

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type='text/javascript'>
         $(function () {
             $.fn.scrollToTop = function () {
                 $(this).hide().removeAttr("href");
                 if ($(window).scrollTop() != "0") {
                     $(this).fadeIn("slow")
                 }
                 var scrollDiv = $(this);
                 $(window).scroll(function () {
                     if ($(window).scrollTop() == "0") {
                         $(scrollDiv).fadeOut("slow")
                     } else {
                         $(scrollDiv).fadeIn("slow")
                     }
                 });
                 $(this).click(function () {
                     $("html, body").animate({
                         scrollTop: 0
                     }, "slow")
                 })
             }
         });
         $(function () {
             $("#hb-gotop").scrollToTop();
         });
    </script> 
<style type="text/css">
 #hb-gotop
  {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  width:80px;
  background-color: #fff198;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');
  text-align:center;
  padding:5px;
  position:fixed;
  bottom:10px;
  right:10px;
  cursor:pointer;
  color:#444;
  text-decoration:none;
  border:1px solid #C9C9C9;
  }
 </style>  


</head >
<body>
<form id="form1" runat="server">

    </form>

        <a href='#gv' id='hb-gotop' style='display:none;'>Go to Top</a>


</body>
</html>

No comments:

Post a Comment

back to top