---
title: "JQuery Scroll to top"  
description: "JQuery Scroll to top"  
author: "Anonymous User"  
published: 2014-10-04  
updated: 2014-10-04  
canonical: https://www.mindstick.com/forum/2300/jquery-scroll-to-top  
category: "jquery"  
tags: ["javascript", "jquery"]  
reading_time: 2 minutes  

---

# JQuery Scroll to top

how to make scroll to top on [page](https://www.mindstick.com/articles/13031/why-to-make-a-wikipedia-page) down\

## Replies

### Reply by Anonymous User

try this code:**javascript code:**

```
<script>    $(function () {        $.extend({            scrollToTop: function () {                var _isScrolling = false;                $("body").append($("<a />")                                .addClass("scroll-to-top")                                .attr({                                    "href": "#",                                    "id": "scrollToTop"                                })                                .append(                                $("<i />")                                    .addClass("glyphicon glyphicon-chevron-up active")                            ));                $("#scrollToTop").click(function (e) {                    e.preventDefault();                    $("body, html").animate({
scrollTop: 0 }, 500);                    return false;                });                $(window).scroll(function () {                     if (!_isScrolling) {                         _isScrolling = true;                         if ($(window).scrollTop() >
150) {                             $("#scrollToTop").stop(true, true).addClass("visible");                            _isScrolling = false;                         } else {                             $("#scrollToTop").stop(true, true).removeClass("visible");                            _isScrolling = false;                         }                     }                 });            }        });         $.scrollToTop();    });</script>
```

**CSS code:**\

```
<style>    a.scroll-to-top.visible {filter: alpha(opacity=75);opacity: 0.75;}a.scroll-to-top {background: #1bafe0;border-radius: 7px 7px 0 0;bottom: 0px;color: #FFF;height: 9px;opacity: 0;padding: 13px 0 35px;position: fixed;right: 10px;text-align: center;text-decoration: none;width: 49px;z-index: 1040;}a.scroll-to-top:hover {filter: alpha(opacity=100);opacity: 1;}</style>
```

Html Code:

```
<a href="#"><i></i></a> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />Hello
```


---

Original Source: https://www.mindstick.com/forum/2300/jquery-scroll-to-top

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.