Pasti sudah tidak asing lagi ya teman-teman mendengar kata Back To Top di satu fasilitas website? Oke kali ini saya akan share bagaimana Cara Membuat jQuery Back To Top.
Apa untung nya jika kita pasang jQuery Back To Top ini? Untung nya adalah jika halaman web sangat jauh sudah kita scroll ke bawah, maka akan lelah jika kita akan scroll lagi ke atas. Nah jQuery ini enak sekali di pakai untuk manfaatkan masalah itu kawan-kawan. Tentu cara ini sangat efektif untuk website anda. Membuat pengunjung dari website anda juga merasa nyaman, karena mereka tidak perlu lagi cape-cape scroll ke atas untuk kembali ke titik awal website.
Maka dari itu jQuery Back To Top ini sangat user friendly kawan-kawan. Hati-hati juga ya jika anda hendak ingin memasang jQuery ini tp sudah ada script jQuery juga didalam website anda, maka yang akan terjadi adalah bentrok atau konflik script javascript. Solusi nya adalah kawan-kawan bisa baca juga artikel Cara Mengatasi Konflik Pada Script jQuery. Oke kawan-kawan langsung saja Cara Membuat jQuery Back To Top.
*(Style tanpa fade in dan fade out)
Apa itu tanpa fade in dan fade out? yang dimaksud adalah tombol Back To Top nya sudah akan langsung muncul di website tanpa kita harus scroll dulu ke bawah. Untuk contoh silahkan kawan-kawan buat script seperti gambar di bawah,
Jika sudah ada jQuery pluggin, silahkan hapus script javascript di atas, dikarenakan bisa terjadi bentrok kawan-kawan.
*(Style dengan fade in dan fade out)
Untuk style dengan fade in dan fade out ini adalah tombol Back To Top tidak akan muncul jika kita belum scroll ke bawah di halaman website. Jadi tunggu kita scroll ke bawah dulu baru dia akan muncul kawan-kawan tombol Back To Top nya. Untuk contoh silahkan buat script seperti gambar di bawah ya,
Isi <div class=”content”> nya dengan konten anda ya kawan-kawan, kalo bisa isi sampai muncul bisa scroll ke bawah. Lalu kawan-kawan coba scroll ke bawah, dan tadaaaam tombol Back To Top nya akan muncul.
Sekian untuk Cara Membuat jQuery Back To Top, semoga bermanfaat.
Terima kasih