Cara Membuat Tombol Back To Top Smooth Jquery

Cara Membuat Tombol Back To Top Smooth Jquery -  Smooth Back to Top dengan Jquery. Itulah yang akan saya share pada kesempatan kali ini, fungsi dari tombol back to top ini adalah sebagai pintasan dari bawah naik keatas, apabila halaman terlalu tinggi saat discroll kebawah dan kita ingin kembali keatas, kita hanya tinggal klik tombol back to top tersebut.

Cara Membuat Tombol Back To Top Smooth Jquery ini saya dapatkan dari MDF-Blog nya kang Abdul Rohman . Berbeda dengan Tombol Back To Top versi sebelumnya yang pernah saya posting Disini, tentunya, kali ini punya tampilan lebih menarik. Untuk demo  bisa dilihat di pojok kanan bawah blog ini. Untuk memasang tombol Back to Top Smooth dengan Jquery ikuti langkah-langkah berikut.

Cara Membuat Tombol Back To Top Smooth Jquery :

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 dan Silahkan anda sesuaikan sendiri.. 

Sekian - Cara Membuat Tombol Back To Top Smooth Jquery

Thanks for MDF-Blog semoga tutorial mengenai Cara Membuat Tombol Back To Top Smooth Jquery ini bermanfaat..