-->

Music

Sabtu, 10 Maret 2012

Membuat Tombol Home Back To Top Dan Bottom

Dengan tambahan Kode ini , memudahkan pembaca untuk balik keTOP  halaman atau sebaliknya..,
Jadi tidak usah Klik mouse /scroll mouse , cukup klik.


Lanngsung aja berikut Langkah-langkahnya ;
1.Masuklah  Ke Akun Blog anda
2.Dasbor Pilih Rancangan-->Edit HTML Dan Centang Kolom Expand Template Widget
3.Cari Kode ]]></b:skin> ( gunakan  F3 untuk memudahkan pencarian )
4.Copy Paste Kode Dibawah Ini Tepat Diatas Kode  ]]></b:skin> 

#binkbenk {
position:fixed;_position:absolute;bottom:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#binkbenk a
{
filter:alpha(opacity=65);
-moz-opacity:0.65;
opacity:0.65;
border:0;
}
#binkbenk img
{
border:0;
}
#binkbenk a:hover
{
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
}

5.Selanjutnya cari kode </body> Dan Letak Kode Dibawah Ini Tepat Diatasnya
<a name='ons-ols'></a>

6.Langkah Terakhir Tinggal Memasukan Kode Dibawah  Ini Tepat Dibawah Kode <body>
<div id='#binkbenk'>
<table border='0'>
<tr>
<td><a expr:href='data:blog.homepageUrl' title='Home'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibyjFItHpEvLCiaP2HrYr3jqHMgFUPxWTxaVLUoKPgLgidSd5ESf5ee8CcsbcUN5dUFinmU1naYZH1uw4DFTx4-JQPGF8IvH7Z1wUcOCxRtO8RgCb8SY0gYBlruLerP7Wz2p3mqovKt6mE/s104/home.PNG'/></a></td>
<td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7ueLZBj6yifJ0VLl6hzykJBlU0Mn90spGkg08taqgtqj_VwD85uiEWX_fX_WY6oqT0dJu4_PSGjHd842Su8oBkC_zYjzKHlRnwBKp6_a1xRjAj1YlN4-_c1mscpWksOkpJmXRy5aJ9AM/s320/pre-icon1.png'/></a></td>
<td><a href='#ons-ols' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq1cSpLxAWOXDakV04yDTwSLzD2r_bgas8W6rCwzXCvmjP4HuW5ZLAZ01uIC6Q0YCiNy34WndQ_tYZxg9TrPYMSUg2nSg-dxjYpHX8KDrj6ftmNBp2u4JO1pFuL783d0FsZlt0aPY7xMI/s320/next-icon2.png'/></a></td>
</tr>
</table>
</div>

6. Klik simpan template
selamat mencoba...........

0 komentar:

Posting Komentar

css