Membuat Floating Image Scroll Top And Down Page

 

Bagaimana? Tertarik untuk mencoba membuat tombol perintah dan ke atas page blog anda? Silahkan ikuti langkah-langkah berikut:

• Setelah login ke akun anda, dari halaman dasbor blogger anda klik template-edit HTML.
• Kopikan kode berikut dan letakkan diatas ]]></b:skin>:

#floating-atas-bawah {
position:fixed; _position:absolute; vertical-align:bottom; width:30px; bottom:5px; right:5px; clip:inherit; z-index:+1000;
}

Note: Atur ukuran yang berwarna merah sesuai keinginan anda!

• Setelah itu kopikan kode berikut dan letakkan dibawah ]]></b:skin>

<script src='http://tipstrikblogging.googlecode.com/files/jquery151.js' type='text/javascript'/>
<script src='http://tipstrikblogging.googlecode.com/files/scrolltopdown.js' type='text/javascript'/>

• Selanjutnya kopi kode HTML berikut dan letakkan dibawah </head>:

<div id='floating-atas-bawah'>
<a href='#header' title='Ke Atas'><img border="0" alt='top' src='https://sites.google.com/site/tipstrikblogging/amatullah/ScrollTop.png'/></a>
<a href='#footer' title='Ke Bawah'><img border="0" alt='down' src='https://sites.google.com/site/tipstrikblogging/amatullah/Scrolldown.pNG’/></a>
</div>

Note:

• Untuk perintah keatas harus sesuai dengan kode CSS template anda, Untuk kode atas template anda, apakah menggunakan top, head, header atau header-wrapper. Demikian juga perintah kebawah harus sesuai dengan kode bawah pada template anda, apakah footer atau bottom".
• Jika anda menginginkan alamat tombol atau gambar panah yang lain silahkan ganti alamat gambar dengan tombol gambar-gambar yang anda sukai!