<div id="back-to-top">
<span class="icon-arrow-up2" title="返回顶部"></span>
<a class="back"></a>
<span class="icon-arrow-down2" title="去底部"></span>
</div>
<div class="progress-bar"></div>
 <script type="text/javascript">
//回到顶部
        $(".icon-arrow-up2").click(function() {
             $("html,body").animate({scrollTop:0}, 800);
        });
         $(document).scroll(function(){
            var scroll_top =  $(document).scrollTop();
            if(scroll_top > 1000){
                 $(".icon-arrow-up2").show();
            }else{
                 $(".icon-arrow-up2").hide();
            }
        });
//去底部
        $(".icon-arrow-down2").click(function() {
            $("html,body").animate({scrollTop:document.body.clientHeight + 'px'}, 800);
        });
         $(document).scroll(function(){
            var  scroll_top = $(document).scrollTop();
            if(scroll_top < 1000){
                $(".icon-arrow-down2").show();
            }else{
                 $(".icon-arrow-down2").hide();
            }
        });
 </script> 

返回顶部指示器

<script>
//百分比
   $(window).scroll(function(){
        var targetPercentage = 70;
        var navBarHeight = 66;
        var targetID = ".index-icon";
        var scrollTo = $(window).scrollTop(),
        docHeight = $(document).height(),
        windowHeight = $(window).height();
        scrollPercent = (scrollTo / (docHeight-windowHeight)) * 100;
        scrollPercent = scrollPercent.toFixed(0);
        $('#back-to-top a').text(scrollPercent+"%");
        if(scrollPercent > targetPercentage){
            $(targetID).css({top:'0'});
        }
        if(scrollPercent < targetPercentage){
            $(targetID).css({ top: '-'+navBarHeight+'px' });
        }
    }).trigger('scroll');
</script>
<script type="text/javascript">
// 长度
$(window).off('scroll');
(function() {
    let progress_bar = $('.progress-bar');
    let win_h = $(window).height();
    let body_h = $('body').height();
    let sHeight = body_h - win_h;

    function updateProgress(p) {
        progress_bar.css('width', p * 100 + '%');
    }
    $(window).on('scroll', function() {
        window.requestAnimationFrame(function(){
            let perc = Math.max(0, Math.min(1, $(window).scrollTop() / sHeight));
            updateProgress(perc);
        });
    });
}());
</script>