chunpin
5/25/2016 - 6:30 AM

back-to-top .JS

back-to-top .JS

// back-to-top .JS
$(document).ready(function(){


    //append the HTML to html page
     var backToTopHtml = '<a id="back-to-top" href="#" class="btn btn-primary btn-lg back-to-top" role="button" title="Click to return on the top page" data-toggle="tooltip" data-placement="left"><span class="glyphicon glyphicon-chevron-up"></span></a>';
     $('body').append(backToTopHtml);


    // css styling
     $('.back-to-top').css({
       'cursor' : 'pointer',
       'position' : 'fixed',
       'bottom' : '20px',
       'right' : '20px',
       'display' : 'none'
     });

    // adding scrolling funciton 
     $(window).scroll(function () {
            if ($(this).scrollTop() > 50) {
                $('#back-to-top').fadeIn();
            } else {
                $('#back-to-top').fadeOut();
            }
        });
        // scroll body to 0px on click
        $('#back-to-top').click(function () {
            $('#back-to-top').tooltip('hide');
            $('body,html').animate({
                scrollTop: 0
            }, 800);
            return false;
        });
        
        $('#back-to-top').tooltip('show');

});