Yang dimaksud Back to Top di sini adalah sebuah tombol/link pada blog kita yang menuju ke bagian atas blog. Sehingga berfungsi untuk memudahkan pengunjung blog kita kalau-kalau mereka ingin kembali membaca untuk memahami artikel yang kita tulis.
Cara kerja Back to Top yang saya buat ini sederhana. Sebenarnya, apabila kita membuat link menuju "#" (<a href="#") maka link tersebut akan mengembalikan kita kembali ke awal saat halaman tersebut dibuka (ke atas halaman). Untuk lebih jelasnya, sobat bisa lihat tombol Back to Top milik saya, seperti itulah kira-kira cara kerjanya.
Nah, berikut adalah tombol Back to Top yang langsung bisa sobat pasang
<a href="#"/><img border="0" src="http://i1129.photobucket.com/albums/m511/blegedex/tooop.png" alt="http://rouens.blogspot.com" title="Back to Top" style="display:scroll;position: fixed; bottom:100px;right:20px;cursor:pointer;style=" opacity:1;filter:alpha(opacity="100";" onmouseover="this.style.opacity=0.5;" onmouseout="this.style.opacity=1;";"/></a>1. Masuk dashboard akun blogger sobat, klik design, lalu page element.
2. Klik add gadget, lalu pilih html/java script.
3. Copy paste kode di atas lalu save.
Keterangan:
Angka-angka berwarna merah adalah angka-angka yang dapat diubah sesuai keinginan sobat.
~Untuk mengganti gambar tombol sesuai kreasi sobat, silahkan ganti url http://i1129.photobucket.com/albums/m511/blegedex/tooop.png dengan url gambar mulik sobat
~bottom:100px; artinya jarak antara link Back to Top sampai ujung bawah sebesar 100 pixel.
~right:20px; artinya jarak link Back to Top sampai ujung kanan sebesar 20 pixel.
~onmouseover="this.style.opacity=0.5;" artinya tingkat ketajaman saat kursor diarahkan pada gambar adalah 50%.
~onmouseout="this.style.opacity=1;" artinya tingkat ketajaman saat kursor tidak diarahkan pada gambar adalah 100%.
7 Comments
