Masih ingat dengan floating image? Itu tuh gambarnya tetap diam sekalipun kita menggulung layar, seperti gambar bola dunia dan panah pada blog ini. Nah, floating image ini bisa kita mamfaatkan untuk perintah ke atas dan ke bawah halaman blog. Dengan adanya perintah ini dapat memudahkan para reader untuk melihat halaman atas/bawah blog kita tanpa harus melakukan penggulungan layar.
Untuk membuat perintah ke atas dan ke bawah dengan floating image ini sebenarnya cukup mudah, kamu tinggal menambahkan link pada floating image tersebut. Tapi jika kamu lagi males mikir dan ingin yang praktis-praktis, ikuti saja langkah-langkah berikut:
· Dari halaman Dasbor Blogger kamu, pilih Tata Letak - Edit HTML.
· Kopikan kode CSS berikut dan letakkan di atas ]]></b:skin>:
#floating-atas-bawah {
position:fixed; _position:absolute; bottom:5px; right:5px; clip:inherit; z-index:+1000;}
· Setelah itu kopikan kode HTML berikut (gunakan Control C) dan letakkan di bawah </head> (antara </head> dan <body>):
<div id='floating-atas-bawah'>
<a href='#' title='Ke Atas'><img border="0" src='http://sites.google.com/site/ruangsc/imgsb/keatas.png'/></a> <a href='#footer' title='Ke Bawah'><img border="0" src='http://sites.google.com/site/ruangsc/imgsb/kebawah.png'/></a>
</div>
Kamu dapat mengganti gambar panah sesuai keinginan. Dan jika perintah kebawah tidak bekerja, gantilah #footer dengan #bottom.
· Simpanlah hasil kerjaan kamu dan
Mudah kan?! Ok brow, selamat mencoba.....
Gambar-gambar yang bisa kamu pilih:
URL:http://sites.google.com/site/ruangsc/imgsb/arrow-up.gif
URL:http://sites.google.com/site/ruangsc/imgsb/arrow-down.gif
URL:http://sites.google.com/site/ruangsc/imgsb/keatas.png
URL:http://sites.google.com/site/ruangsc/imgsb/kebawah.png
URL:http://sites.google.com/site/ruangsc/imgsb/scrolltop.png
URL:http://sites.google.com/site/ruangsc/imgsb/scrolldown.png
9/27/2011
Posted by GuruGoBlog
on 08.20
