Cara Membuat Scroll To Top Button

Pada waktu yang lalu saya sudah memposting dengan efek scroll atau menggulung halaman ke atas. Nah sekarang saya mencoba untuk share cara Membuat Back To Top Button.

Berbeda dengan scroll to top yang mempunyai efek menggulung halaman, Back To Top Button membawa pengguna langsung menuju ke atas halaman ketika di klik. Cara Membuat Back To Top Button juga berbeda dengan scroll to top yaitu pada scroll to top kita harus memasukan kode scriptnya pada template dengan mengedit kode HTML template blog. Sedangkan pada cara Membuat Back To Top Button kita tidak perlu mengobok-obok HTML template blog, hanya menambahkan kode scriptnya pada gadget HTML sidebar blog.

Cara Membuat Back To Top Button seperti di bawah ini:

1. Kita login ke dashboard >> Layout/Tata Letak >> Add a gadget >> Pilih HTML/JavaScript >> kemudian copas kode di bawah ini:

<div style="display:scroll;position:fixed;bottom:5px;right:5px; moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;"><a href="#" title="Back to Top"> Back To Top </a></div>

right menunjukan button berada di sebelah kanan, ganti dengan left apabila Anda menginginkan button berada di sebelah kiri.

2. Simpan widget Anda dan lihat penampakannya di halaman blog Anda.

Demikian sharing Membuat Back To Top Button kali ini mudah-mudahan bermanfaat.