Cara Membuat Tombol Back To Top [Evo Magz]

Back to top - kali ini saya akan membagikan tutorial cara menambahkan tombol back to top seperti Evo magz :v , Caranya sangat mudah langsung saja ikuti tutorial berikut ini:

1. Log in akun blogger
2. masuk ke halaman template >> EDIT HTML
3. letakkan kode dibawah ini diatas kode ]]></b:skin> atau </style>

/* back to top */
#back-to-top {
background:#E73037;
color:#ffffff;
padding:8px 10px;
font-size:24px;
}
.back-to-top {
position:fixed !important;
position:absolute;
bottom:20px;
right:20px;
z-index:999;
}

4. letakkan kode dibawah ini diatas kode </body>

<script>            
$(window).scroll(function() {
    if($(this).scrollTop() &gt; 200) {
        $(&#39;#back-to-top&#39;).fadeIn();
    } else {
        $(&#39;#back-to-top&#39;).fadeOut();
    }
});

$(&#39;#back-to-top&#39;).hide().click(function() {
    $(&#39;html, body&#39;).animate({scrollTop:0}, 1000);
    return false;
});
</script>

5. Simpan Template
6. masuk ke halaman tata letak >> tambah widget >> HTML/JavaScript
7. masukkan kode ini

<div class='back-to-top'><a href='#' id='back-to-top' title='back to top'>
<i class='fa fa-chevron-up'/>
</a></div>

8. Simpan & lihat hasilnya

Jika Tanda panahnya tidak muncul masukkan kode ini diatas <link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
 kode </head>

DEMO

Semoga Bermanfaat ...