Cara Membuat Show/hide Sederhana di Blog A Z K A V E I R O: Cara Membuat Show/hide Sederhana di Blog
0

Cara Membuat Show/hide Sederhana di Blog

Share on :

Kali ini saya akan memberi tips lagi untuk sobat blogger yaitu bagaimana cara membuat panel show/hide yang lebih sederhana. Show/hide atau biasa di sebut spoiler, sangat berguna kala kita memposting sebuah artikel, terutama artikel yang banyak mengandug gambar. Gambar dalampostingan akan disembunyikan dan hanya bisa di buka ketika kita mengklik tombol buka.
Kalau begitu tanpa basa - basi lagi  kita langsung saja Tutorial blogspot nya :
  • Langkah pertama copy code berikut dan tempatkan tepat di bawah <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(){
$(&quot;.flip&quot;).click(function(){
$(&quot;.panel&quot;).slideToggle(&quot;slow&quot;);
});
});
</script>
  • Langkah kedua menempatkan CSS kodenya, tepat dia atas tag ]]></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;
}
Kemudian Save template anda.
  • Langkah terakhir tinggal menepatkan kode berikut di antara tag <body> dan </body>  atau bisa juga di sidebar.
<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://christiantatelu.blogspot.com/">IDE BAGUS</a></span>
</div>
<p class="flip">show/hide</p>
Sekian..

PPC Iklan Blogger Indonesia

Ditulis Oleh : Unknown ~ Tips dan Trik Blogspot

Azka Latif Noor Sobat sedang membaca artikel tentang Cara Membuat Show/hide Sederhana di Blog. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya

:: Get this widget ! ::

0 komentar:

Posting Komentar

BLOG INI DOFOLLOW .
Silahkan tinggalkan komentar dan kritik sobat, tapi mohon jangan SPAM ya..!
Komentar SPAM akan di HAPUS oleh admin.
Komentar yang membangun sangat dibutuhkan oleh blog ini.
Terima Kasih.

Back to Top