Cara Memasang Scroll Back To Top di Blog

Tutorial Belajar Blog - Cara Membuat Scroll Back To Top di Blog.. Bagi sebagian sobat mungkin sudah familiar dengan kata-kata scroll back to top / kembali ke atas.. Untuk membuat Tombol Back to Top biasa, mudah saja sebetulnya, tinggal menambahkan kode script..

Berikut Langkah-langkahnya :

1. Login akun Blogger anda..

2. Pada Dashboard pilih Template » Edit HTML

3. Letakkan kode berikut ini dibawah kode ]]></b:skin>

<style> #backtop{cursor:pointer;position:fixed!important;position:absolute;bottom:-70px;z-index:99;background-color:#7F007B;border:2px solid #333;-webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;-moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #333;width:45px;height:45px;overflow:hidden;text-indent:-999px;-webkit-border-top-left-radius: 30px; -moz-border-radius-topleft: 30px; border-top-left-radius: 30px;} #backtop::after{content:&quot;&quot;;position:absolute;top:-4px;left:15px;width:0;height:0;border-width:18px 7px;border-style:solid;border-color:transparent transparent #f7f7f7 transparent;} </style>

4. Kemudian letakkan kode berikut ini diatas kode </body>

<div id='backtop'>Back to Top</div> <script type='text/javascript'> //<![CDATA[ $(window).scroll(function(){if($(this).scrollTop()>100){$("#backtop").removeAttr("href");$("#backtop").stop().animate({bottom:"-3",right:"0"},{duration:800,queue:false})}else{$("#backtop").stop().animate({bottom:"-50",right:"0"},{duration:1000,queue:false})}});$(function(){$("#backtop").click(function(){$("html, body").animate({scrollTop:0},"slow");return false})}); //]]> </script>

5. Simpan Template.....

.....SEMOGA BERMANFAAT.....

SUMBER