Spoiler ala Kaskus dengan jQuery
Seperti biasanya, coding saya lakukan di CodePen agar kamu mudah mengunduh maupun memanipulasinya. Kamu bisa melihat spoiler ala Kaskus bikinan saya di bawah ini. Klik "show" untuk mengeluarkan isi dari spoiler. Klik "hide" untuk menyembunyikannya kembali.Mudah bukan? Kamu juga bisa membuatnya. Jangan lupa untuk menautkan pustaka jQuery untuk menjalankan kode jQuery yang dibutuhkan untuk membuat spoiler ini. Jika kamu masih bingung bagaimana cara menautkannya, kamu bisa membaca entri Iskael sebelumnya yang membahas mengenai masalah ini.
wah boleh di coba ini.. biar ga kepanjangan kalau bikin post.
BalasHapussilakan mas :)
Hapuskok aku bingung yah, aku kira cuma pasang kode html doang di bagian kotak editor blog
BalasHapus*kode spoiler blog yg ada kebanyakan sangat panjang
masa sih panjang yo? :O
Hapusoke, besok aku akan buat spoiler yang langsung bisa diterapin di entri blogspot atau wp aja yah :)
sepertinya itu akan sangat membantu banyak orang :)
ana belom nyobain kode di atas (lagi males), tapi dari apa yang bisa ana lihat, kode diatas akan membuka semua spoiler yang ada di halaman tersebut hanya dengan satu tombol.
BalasHapusjadi...
ya iya lah :D
Hapusbeda dengan spoiler Konami yang kamu bikin :D
=.=a
Hapusbukan itu maksudku... coba kamu pakai selector 'children' dan 'toggleclass' pada script spoiler tersebut... supaya seandainya ada lebih dari 1 spoiler dalam satu halaman, satu tombol spoiler hanya akan membuka spoiler yang ada di bawahnya (sedangkan spoiler lainnya tidak terbuka).
ouwh iya :D
Hapusya nanti aku pikirkan lagi :P
saya juga bikin spoiler. tapi pakai fieldset.. tag yang jarang sekali saya pakai.
Hapushttp://blog*linarian*com/2013/09/institut-lele-tempat-makan-enak-di-keputih-surabaya.html
kalau dibuka satu., yang lain tidak ikut terbuka :)
wow, keren :D
Hapussibb gan langsung saya praktekkan di web saya :D
BalasHapussilakan gan
Hapustapi cara saya ada cacatnya kalo spoilernya lebih dari satu
kalo lebih dari satu gunakan .addClass dan .removeClass
koq aq gagal yach? aq udah copy semua tp koq ga ada hasilnya?
BalasHapusjQuery-nya mungkin belum mas pasang
Hapuscara asang di blogspot gimana ya?
BalasHapuskok ane gagal
naruh kode ini dimana
$("#hide").click(function(){
$("#area").hide("slow");
});
$("#show").click(function(){
$("#area").show("slow");
});
$("#toggle").click(function(){
$("#area").toggle("slow");
});
apakah jquery nya sudah dipasang?
Hapustaruh kode tersebut di atas < /head >
dengan diapit oleh < script > dan < /script >