Spoiler Sederhana efek jquery

letakan kode di bawah ini tepat sebelum kode ]]></b:skin>

/* Spoiler sederhana dengan JQuery */ blockquote.spoiler { font:normal normal 11px/16px Verdana,Arial,Sans-Serif; color:#666; border:2px dashed #cec2c2; background-color:#eee2e2; padding:18px 20px; -webkit-box-shadow:inset 0px 0px 7px #222; -moz-box-shadow:inset 0px 0px 7px #222; box-shadow:inset 0px 0px 7px #222; margin:0px 30px 15px; /* overflow:auto; height:250px; (opsional) */ } button.sp-trigger { display:block; outline:none; cursor:pointer; margin:20px 0px 10px 30px; border:none; background-color:green; font:bold 11px Verdana,Arial,Sans-Serif; color:white; text-shadow:0px 1px 0px rgba(0,0,0,0.4); padding:5px 10px; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4); -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4); box-shadow:0px 1px 2px rgba(0,0,0,0.4); } button.sp-trigger.sp-active {background-color:#981515}

kemudian letakan kode di bawah ini tepat sebelum kode </head>

<script type='text/javascript'> //<![CDATA[ $(function() { $('blockquote.spoiler').hide(1000).before('<button class="sp-trigger">Lihat Konten</button>'); $('button.sp-trigger').toggle(function() { $(this).addClass('sp-active').text('Tutup').next().slideDown(1000); }, function() { $(this).removeClass('sp-active').text('Lihat Konten').next().slideUp(1000); }); }); //]]> </script>

yang terakhir masukan kode di bawah ini untuk kata kuncinya

<blockquote class="spoiler"> Konten di sini... </blockquote>

Selesai.

Ditulis Oleh : Unknown ~ Czikart Software

Anda sedang membaca sebuah artikel yang berjudul Spoiler Sederhana efek jquery, Silahkan download software, games, Antivirus ataupun tutorial sepuasnya secara gratis di czikart software dan tetap kunjungi czikart software. Dan bagi yang ingin Copy Paste, Silahkan sertakan link sumbernya karena kami tidak bertanggung jawab jika blog/web anda dihapus oleh google kareana tidak menyertakan link sumbernya sesuai aturan dari google, Semoga artikel tersebut bermanfaat untuk anda, Mohon maaf apabila konten yang anda baca rusak atau salah dalam penulisan. Jika ada pertanyaan, kritik, dan saran yang ingin di sampaikan silahkan komentar.

:: Terima Kasih ! ::