Cara memasang back to top di blogger

Pada ksesempatan kali ini saya akan coba membagikan Cara membuat atau memasang back to top dan mungkin cara seperti ini sudah banyak yg share, tapi apa salahnya saya share kembali siapa tau masih banyak yang belum bisa menerapkannya di blog, ok untuk sobat yang belum tahu caranya bisa ikuti langkah-langkah dibawah ini dengan seksama, dan untuk yang sudah tahu caranya bisa menyimak saja ya.

Langsung saja jika sobat berminat menerapkannya silahkan pasang terlebih dahulu code dibawah ini tepat sebelum </head>

<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>

Jika code diatas sudah terpasang selanjutnya silahkan sobat pasang code CSS dibawah ini dan letakan tepat sebelum </style> atau bisa juga sebelum </b:skin>

.smoothscroll-top {
    position:fixed;
    opacity:0;
    visibility:hidden;
    overflow:hidden;
    text-align:center;
    z-index:99;
    background-color:#2ba6e1;
    color:#fff;
    width:47px;
    height:44px;
    line-height:44px;
    right:25px;
    bottom:-25px;
    padding-top:2px;
    border-radius:5px;
    transition:all 0.5s ease-in-out;
    transition-delay:0.2s;
}
.smoothscroll-top:hover {
    background-color:#3eb2ea;
    color:#fff;
    transition:all 0.2s ease-in-out;
    transition-delay:0s;
}
.smoothscroll-top.show {
    visibility:visible;
    cursor:pointer;
    opacity:1;
    bottom:25px;
}
.smoothscroll-top i.fa {
    line-height:inherit;
}

Setelah memasang code CSS diatas langkah selanjutnya silahkan letakan code dibawah ini tepat sebelum </body>

<div class="smoothscroll-top">
    <span class="scroll-top-inner">
        <i class="fa fa-2x fa-arrow-circle-up"></i>
    </span>
</div>
<script type='text/javascript'>
//<![CDATA[
$(function(){
    $(document).on( 'scroll', function(){
        if ($(window).scrollTop() > 100) {
            $('.smoothscroll-top').addClass('show');
        } else {
            $('.smoothscroll-top').removeClass('show');
        }
    });
    $('.smoothscroll-top').on('click', scrollToTop);
});
function scrollToTop() {
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0;
    element = $('body');
    offset = element.offset();
    offsetTop = offset.top;
    $('html, body').animate({scrollTop: offsetTop}, 600, 'linear');
}
//]]>
</script>

Untuk langkah trakhir silahkan sobat save templatenya dan bisa lihat hasilnya diblog. Mungkin dari saya cukup dulu tentang Cara Membuat Back To Top Keren Di blog selamat mencoba sobat.

If You Enjoyed This, Take 5 Seconds To Share It

• 
• 
• 
• 
• 
•