Rabu, 18 April 2012

Cara Membuat Back To Top Melayang

Hai Sobat Bithoo Pada Postingan kali ini, saya akan memberikan Cara Membuat Back To Top Melayang Di Blog, Semoga dapat bermanfaat, dan jangan bosan-bosan yah baca postingan yang lain dari Bithoo. Emmm Kita langsung aja yah....!!!


Fitur Back To Top/Scroll To Top, seperti yang telah dijelaskan dalam Cara Membuat Back To Top di Blog, adalah fitur navigasi blog yang berfungsi sebagai shortcut agar pengunjung bisa kembali ke bagian atas halaman blog dengan cepat dan hanya dalam satu klik.

Tombol back to Top Blogspot kali ini berjenis melayang (floating) dan berada di bagian pojok kanan bawah. Kodenya pun sedehana dan tidak menggunakan javascript/jquery sehingga waktu muatnya lebih pendek. Script ini dibuat berdasarkan perintah link yang mengacu ke wrapper (#) dengan ditambah aturan CSS position-styling. Easy.

Cara Memasang Back to Top Di Blog:
1. Copy kode berikut:

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Scroll/Back to Top"><img src="url gambar back to top blog" /></a>

Anda dapat mengganti title Scroll/Back to Top dengan kata-kata yang diinginkan. Ganti url gambar back to top blog dengan gambar back to top anda, atau copy salah satu dari beberapa gambar "Back To Top" di posting tips-tricks blogger sebelumnya: Cara Membuat Fitur/Tombol Back To Top di Blogger (V1), atau bisa juga googling dengan keyword "back to top button image". Edit ukurannya sesuai dengan besar yang diinginkan, lalu upload. Masukkan url gambar yang telah diupload ke dalam script.

2. Buka dashboard > Design/Rancangan > Klik Add a/Tambah Gadget > Pilih opsi HTML/Javascript

3. Paste/letakkan kode tersebut, lalu save.

Posisi gadget dimanapun tidak masalah karena letak tombol tersebut fixed (tetap), yang menjadikannya melayang.

4. Done!

Have Fun with your Back to Top Button!

Ditulis Oleh : Unknown ~ Bithoo Trik dan Tips

Anda sedang membaca sebuah artikel yang berjudul Cara Membuat Back To Top Melayang,, Semoga artikel tersebut bermanfaat untuk anda, Dan mohon maaf karena Bithoo dalam pengembangan jadi maaf klau ada yang kurang berkenan. Dan apa bila sobat Bithoo ingin artikel ini di blog sobat Bithoo silahkan menggunakan kode dibawah ini.

:: Thank you for visiting ! ::

0 komentar:

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Bithoo | Bloggerized by Lasantha - Premium Blogger Themes | Bluehost