Petik.net - Tombol back to top atau tombol kembali keatas, yakni sebuah kemudahan yang bisa kita pasang pada halaman situs atau blog dalam bentuk sebuah tombol yang berfungsi untuk kembali ke halaman paling atas dikala tombol tersebut kita tekan, tujuannya ialah untuk memudahkan pengunjung apabila mereka menetapkan untuk kembali melihat atau menuju ke titik awal halaman, dengan adanya fasilitas tombol back to top, dan dengan menekannya maka para pengunjung dengan mudah akan dibawa kembali ke titik awal halaman secara otomatis (halaman menggulung atau bergulir sendiri), dan ini sangat efektif jikalau dibandingkan halaman tersebut harus di scroll atau digulung secara manual.
Cara kerja tombol back to top atau tombol kembali keatas
Pada umumnya tombol back to top atau tombol kembali keatas akan berfungsi dan secara otomatis muncul untuk kita klik dikala isi artikel sudah melebihi batas tinggi layar monitor, artinya tombol back to top akan muncul untuk memfasilitasi artikel atau halaman yang sangat panjang, sehingga ketika sudah melebihi batas layar, tombol back to top akan muncul secara otomatis dan siap kita klik itu juga seandainya kita menetapkan untuk kembali ka batas atas halaman, namun untuk halaman pendek dan kurang dari ukuran tinggi layar tombol back to top tidak akan muncul, letak tombol back to top biasanya dipasang dan muncul di sudut kanan batas bawah halaman.
Seiring dengan kreatifitas para blogger, ketika ini banyak tersedia blog-blog yang menyajikan cara pemasangan atau pembuatan tombol back to top dengan banyak sekali macam imbas yang kelihatan keren dan mengagumkan, ada yang dibuat cukup sederhana tanpa efek sedikitpun, lalu ada juga imbas scroll, imbas geser, imbas bounce bahkan hingga efek fadding juga efek smoth, dan mungkin juga akan muncul imbas-imbas lainnya seiring dengan kreativitas para blogger yang inovatif.
Untuk menciptakan tombol back to top memerlukan script CSS HTML Javascript atau JQuery
Perlu kita ketahui untuk menciptakan atau memasang tombol back to top atau tombol kembali keatas pada blog yang kita miliki, tidak akan lepas dari yang namanya bahasa pemrograman web, biasanya pembuatan akomodasi widget tidak akan lepas dari 3 bahasa pemrograman yakni CSS, Javascript atau Framework JQuery dan script HTML, ketiga bahasa tersebut berkolaborasi sesuai dengan fungsinya masing-masing untuk membuat fasilitas widget keren yang mampu kita pasang pada blog baik itu blog berflatform blogspot maupun wordpress atau halaman situs langsung.
Ketiga instruksi script tersebut memang mempunyai fungsi masing-masing, Script HTML untuk mendefinisikan tag tag html sebagai pembungkus atau fondasi web yang akan dimanipulasi, script CSS untuk mendekorasi dan megatur tata letak setiap tag HTML yang kita definisikan, sedangkan javascript atau jquery adalah untuk membuat tampilan lebih interaktif.
Cara Membuat tombol Back to top dengan banyak sekali efek yang mampu anda pilih
pada artikel kali ini akan dibahas mengenai cara menciptakan atau memasang dan memunculkan tombol back to top atau tombol kembali ke atas dengan beberapa efek lengkap sebagai berikut:
1. Cara Membuat tombol back to top dengan efek memantul (bounce)
Efek bounce artinya imbas mirip bola memantul, dikala layar di gulung dan sudah hingga pada titik awal halaman, ada sedikit imbas seperti pantulan bola, untuk menerapkannya silahkan ikuti langkah berikut:
a. Masuk ke template blog anda, cari aba-aba simpan isyarat berikut tepat diatas
2. Membuat tombol back to top dengan efek geser yang halus keatas
untk membuat tombol back to top yang mempunyai imbas geser keatas secara halus ikuti langkah berikut:
a. Masuk ke template blog anda, cari arahan simpan instruksi berikut sempurna diatas
c. Buat widget gres, pilih widget untuk HTML/javascript lalu kopikan instruksi berikut dan simpan
3. Membuat tombol back to top dengan efek Fading dan smooth
Efek fading & smooth adalah, visibilas objek yang muncul atau hilang secara halus, atau dikenal dengan sebutan fade in atau fade out, untuk menciptakan tombol back to top dengan imbas fading dan smooth ikuti langkah berikut:
a. Masuk ke template blog anda, cari kode simpan aba-aba berikut tepat diatas
Pada script diatas silahkan anda ganti goresan pena “URL Gambar Back to Top” dengan lokasi gambar back to top yang anda miliki atau ganti aja dengan url gambar berikut:
http://2.bp.blogspot.com/-MFhU3vLp5ho/UiaBZeA1McI/AAAAAAAAAQs/MrzW2ljP5mA/s1600/arrow-up_basic_blue.png
Baca juga: Cara menciptakan widget like facebook melayang ala strukturkode
Demikian yang bisa aku share tentang Cara Membuat tombol back to top dengan berbagai Pilihan imbas lengkap, selamat mencoba dan supaya bermanfaat.
Follow us on
