JS - Back To Top Animation

back-to-top.js

/*

Back To Top Script (and CSS)

Your Classic Back To Top Script that everyone has come to love. Had to make one for one of my projects that was way to long
so I decided to learn how to do it from scratch following a tutorial on net.tutsplus.com


Reference:
http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-implement-a-sticky-back-to-top-button/

*/

/* CSS

.go-top {
    position:fixed;
    bottom:2em;
    right:2em;
    text-decoration:none;
    color:white;
    background-color:#616161;
    opacity:0.8;
    padding:5px 10px;
    display:none;
}

.go-top:hover {
    background-color:#3B90CE;
    opacity:1;
    color:white;
}


*/



var backTop = {
    init: function(){
        $(doc).ready(function(){
            
                // Show or Hide The Sticky Footer Button

                $(window).scroll(function(){
                    if ($(this).scrollTop() > 200 ) {

                        $('.go-top').fadeIn(200);
                    } else {
                        $('.go-top').fadeOut(200);
                    }
                });


                // Animate the scroll to top

                $('.go-top').click(function(e){

                    e.preventDefault();

                    $('html,body').animate({scrollTop: 0}, 300);

                });

        });
    }
};