Cara membuat Tombol Home,Back to Top dan down


By on 12/19/2011



Oke kawan pada posting kali ini saya memostingkan tentang cara membuat Tombol home,back to top dan down,yg di request oleh salah satu rekan saya di kampus ..kebetulan saya sudah memakai dan mencoba jika rekan-rekan ingin mencoba sok silahkan berikut caranya :


1.Masuk Ke akun Blog Rekan-rekan
2.Pada Dasbor Pilih Rancangan-->Edit HTML Dan jangan Lupa Centang Kolom Expand Template Widget
3.Kemudian Cari Kode ]]></b:skin>  ( gunakan CTRL F atau F3 untuk memudahkan pencarian )
4.Copy Paste Kode Dibawah Ini Tepat Diatas Kode yg berwarna merah diatas


#mangetsu {
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); }
#mangetsu a
{
filter:alpha(opacity=65);
-moz-opacity:0.65;
opacity:0.65;
border:0;
}
#mangetsu img
{
border:0;
}
#mangetsu a:hover
{
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
}


5.Selanjutnya cari kode </body> Dan Letakan Kode Dibawah Ini Tepat Diatasnya


<a name='ngisor-dhewe'></a>

6.Langkah Terakhir Tinggal Memasukan Kode Dibawah  Ini Tepat Dibawah Kode <body>

<div id='mangetsu'>
<table border='0'>
<tr>
<td><a expr:href='data:blog.homepageUrl' title='Home'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOvmmV6btRkhR5ht6rIrKKz0vkFr4ZzBh40jxbY2iFheAfjVW0ezCUZ6Y41aFOKO1fOZXVtuLn6MH-ooGI__i006ArVBtBWbiXvKCBODf4qI4Ai4gucrd5AC9TdyVhtLsdoXDKi4qQ6DM/s320/home-icon2.png'/></a></td>
<td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVw80GVE3_hLZ-vPk4HSiNM165Ihqkla3aRETFyV_OPiT96lw5T2We8xkidDU5tOG7PeDEcG5X1mmu49XTgsyX2DEHc9vQF1NuSHT3YAaRYyBlKsmyTeG5MeDVQH2KLvy91oWCwcN1VwI/s320/pre-icon1.png'/></a></td>
<td><a href='#ngisor-dhewe' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLGo7TOUdZ92-zif0WgaJKp46GSFXW9z7atzsv3piKsPC56P9YI1F5K7oGK91HeaZQwwYy-If8e9Mql3LgDYxk93MK1IcXqGfib9zvFqE3miRYal7N6N1cpJNngXJP5FLqhJdHCSz2nwY/s320/next-icon2.png'/></a></td>
</tr>
</table>
</div> 

7.Selesai tinggal simpan template anda dan lihat lah ada perbedaanya :D

About Eko Septiawan

EKKO adalah seorang pemuda yang dikaruniai seni Blogging. Ia suka Blogging setiap hari. Ia adalah seorang Desainer Situs Web dan Desainer Grafis Bersertifikat.

0 comments:

Posting Komentar