RSS
Network
Jumat, 19 Agustus 2011
PANEL DROPDOWN
Panel dropdown adalah widget yang menyembunyikan dan menampilkan gadget secara scroll sebagaimana yang dapat dilihat di sidebar halaman ini.Fungsinya adalah memperkemas blog untuk lebih ringkas dan memberi kesan kepada pengunjung blog tersebut,berikut salah satu cara membuat panel fungsi dropdown secara scroll.
1.Masukkan kode berikut dibawah kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".flip ").click(function(){
$(".panel").slideToggle("slow");
});
});
</script>
2.Masukkan kode ini di atas kode ]]></b:skin>
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:center;
background:black;
border:solid 1px #c3c3c3;
}
div.panel
{
height:120px;
display:none;
}
3.Memasukkan kode gadget yang discroll_kan,kode ini dapat diletakkan di manapun sesuai kebutuhan setelah kode <body> sampai kode </body> atau juga dapat dimasukkan dalam penambahan gadget Html
<div class="panel">
<p>TEKS ANDA DISINI!</p>
<p>TEKS ANDA DISNI!</p>
<span style="float: left; font-size: 80%;">Widget by <a href="http://www.abdur-rozak.co.cc/">Abdur</a></span>
</div>
<p class="flip">tampilkan/sembunyikan</p>
Kode <p>TEKS....</p> dapat diganti dengan kode gadget kata tampilkan/sembunyikan dapat dirubah menjadi judul panel yang di inginkan.Langkah terakhir SIMPAN TEMPLATES/SAVE TEMPLATES
<script type='text/javascript'>
$(document).ready(function(){
$(".
$(".panel").slideToggle("slow");
});
});
</script>
2.Masukkan kode ini di atas kode ]]></b:skin>
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:center;
background:black;
border:solid 1px #c3c3c3;
}
div.panel
{
height:120px;
display:none;
}
3.Memasukkan kode gadget yang discroll_kan,kode ini dapat diletakkan di manapun sesuai kebutuhan setelah kode <body> sampai kode </body> atau juga dapat dimasukkan dalam penambahan gadget Html
<div class="panel">
<p>TEKS ANDA DISINI!</p>
<p>TEKS ANDA DISNI!</p>
<span style="float: left; font-size: 80%;">Widget by <a href="http://www.abdur-rozak.co.cc/">Abdur</a></span>
</div>
<p class="flip">tampilkan/sembunyikan</p>
Kode <p>TEKS....</p> dapat diganti dengan kode gadget kata tampilkan/sembunyikan dapat dirubah menjadi judul panel yang di inginkan.Langkah terakhir SIMPAN TEMPLATES/SAVE TEMPLATES
designed by seotemplate.net support by Hosting Rajawali
Label:TRICK BLOG,WIDGET BLOG
Langganan:
Posting Komentar
(Atom)
0 komentar:
Posting Komentar