Membuat Back To Top Button

Pada waktu yang kemudian aku sudah memposting cara menciptakan scroll to top button dengan efek scroll atau menggulung halaman ke atas. Nah kini aku mencoba untuk share cara Membuat Back To Top Button.

Berbeda dengan scroll to top yang memiliki efek menggulung halaman, Back To Top Button membawa pengguna pribadi menuju ke atas halaman saat di klik. Cara Membuat Back To Top Button juga berbeda dengan scroll to top ialah pada scroll to top kita harus memasukan arahan scriptnya pada template dengan mengedit arahan HTML template blog. Sedangkan pada cara Membuat Back To Top Button kita tidak perlu mengobok-obok HTML template blog, hanya menambahkan arahan 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 arahan 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="Membuat Back To Top Button"> Back To Top </a></div>
 

right menandakan 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.

Sumber https://www.kompiajaib.com/

Share this post