Sunday, October 9, 2016
Cara membuat Tombol Back to Top dengan mudah
Cara membuat Tombol Back to Top dengan mudah
Tombol back to top berfungsi untuk memudahkan pengunjung untuk kembali ke bagian atas dari suatu halaman. pada widget ini selain tombol back to top juga terdapat tombol back to bottom untuk menampilkan bagian bawah halaman.
Langsung saja Sob, berikut caranya :
- Login ke Blogger, Klik Design/Rancangan > Edit HTML .
- Beri tanda centang pada Expand Template Widget.Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
- Copy kode berikut dan pastekan di atas ]]></b:skin>#floating-up {
position:fixed;_position:absolute;top:280px; right:0px; clip:inherit;
_bottom:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#floating-up a
{
filter:alpha(opacity=65);
-moz-opacity:0.65;
opacity:0.65;
border:0;
}
#floating-up img
{
border:0;
}
#floating-up a:hover
{
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
} - Lalu tambahkan kode <a name=to-bottom></a> tepat diatas kode </body>.
- Kemudian cari kode <body>, dan paste kode berikut dibawah <body> : <div id=floating-up>
<div><a href=# title=back to top><img alt=back to top src=http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-top.png/></a></div>
<div><a href=#to-bottom title=back to bottom><img alt=back to bottom src=http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-bottom.png/></a></div>
</div> - Terakhir klik Save / Simpan Template.
Go to link Download
