Kali ini, saya akan mengajarkan cara membuat tombol "Back To Top"
Kali ini, saya akan mengajarkan cara membuat tombol "Back To Top"
Dan akan ada 2 versi yang akan dibuat di artikel ini, satu versi biasa dan sangat mudah untuk dibuat,
yang satu sedkit lebih susah tapi lebih bagus hasilnya :D
Ane akan mulai dengan yang paling mudah dulu:
Cara paling mudah dalam membuat tombol back to top adalah dengan memberikan "#top" sebagai
value dari atribut href di tag <a>
Jadi, hanya dengan <a href="#top">Back to top</a>, tombol back to top dapat dibuat dengan
mudah
Cara yang sedikit lebih susah menggunakan jquery:
Pertama, ketik kode ini dulu (jangan lupa include jquery dulu ya):
function atas() {
$('html, body').animate({
scrollTop: 0
}, 1500);
}
Setelah itu, cukup dengan <a href="javascript:atas();">Back to top</a>, tombol back to top ala
jQuery ini bisa dibuat, keunggulan dari back to top ala jQuery adalah ada animasinya sehingga lebih
mantap :D
Sekian dari ane, semoga bermanfaat
Sumber : jagocoding.com
No comments:
Post a Comment