Lama Tidak menulis artikel, pada kesempatan kali ini
boelshare ingin memberikan trik tutorial membuat Animasi
Back to Top atau
Scroll to Top pada
blogspot. Apa itu Back to Top??, Back to Top atau scroll to top adalah semacam "Page Jump" untuk mempermudah pengunjung blog kembali kehalaman atas tanpa melakukan scroll pada mouse. Biasanya tombol back to top di letakkan di bawah halaman blog. Untuk membuat tombol / button Back to Top diperlukan kode script sperti ini:
- Login ke blogger.
- Masuk ke Template => Edit HTML => Proceed => Expand Widget Templates.
- Tambahkan kode ini: id="top" pada bagian <body> , sehingga menjadi <body id="top"> atau bisa juga tambahkan kode ini : <div id='top'></div> dibawah kode <body> , gunakan CTRL + F untuk mempermudah pencarian
- Kemudian masukkan kode ini
sebelum kode </body>
-
agar posisi tombolnya berada di sebelah pojok kanan bawah, tambahkan kode css berikut ini:
#back-top{position:fixed;bottom:8px;right:10px}
#back-top img{opacity:0.3;-webkit-transition:1s;-moz-transition:1s;transition:1s}
#back-top img:hover{opacity:1.0}
-
Simpan Template, selesai....
Contohnya bisa di lihat pada blog ini,,semoga bermanfaat..
0 comments on Scroll to Top Animation for Blogger with Jquery :
Post a Comment