JQuery Scroll to top

Anonymous User 2211 04 Oct 2014

how to make scroll to top on page down

Ask by Anonymous User

Updated 04 Oct 2014

1 Answers

Anonymous User 04 Oct 2014

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

Markdown for AI

A clean, structured version of this page for AI assistants and LLMs.

Open .md

forum

JQuery Scroll to top

Can you answer this question?

1 Answers