Membuat Tombol Show Hide Dengan Text Link & Gambar Sederhana

Ahmad Susanto - Kembali lagi dengan admin yang pecinta cewek cantik dan ibu-ibu muda menyusui ini akan berbagi tutorial sederhana yang mungkin tidak penting tapi lumayan buat ngecilin otong halaman, Sebenarnya sama saja bro, Lama loadnya sama tapi lebih enak pas di scroll tidak berat gitu.

Baca Juga : Cara Posting Kode Syntax Highlight Di Nextwapblog.

Silahkan lihat contoh di bawah:


[Klik Untuk Buka]
Ini scriptnya:

Keleman dari script ini adalah "Tidak Bisa Buat Double Script", Atau untuk satu halaman cuma bisa satu script, Kecuali kita mengubah ID nya.. Caranya perhatikan kode di bawah ini:
<a id="show_id" onclick="document.getElementById('spoiler_id').style.display=''; document.getElementById('show_id').style.display='none';">[Klik Untuk Buka]</a><span id="spoiler_id" style="display: none;"><a class="link" onclick="document.getElementById('spoiler_id').style.display='none'; document.getElementById('show_id').style.display='';">[Klik Untuk tutup]</a><br/>
<div class="ijo">Semoga saya bisa naik haji bareng keluarga tercinta.</div>
</span>
Perhatikan yang di stabilo, Kalo kalian mau nambahin script ini lebih satu pastikan anda sudah merubah teks yang saya stabilo, Untuk yang warna contok jika ente merubah id yang warna biru, ente samain semua yang berstabilo biru (show_id).. Jika kamu mau mengubah show_id menjadi show_koplak kamu harus mengubah semua yg bertuliskan show_id menjadi show_koplak, begitupun dengan spoiler_id.

Bagaimana caranya mengubah tombolnya menjadi gambar..??
Caranya kalian ubah teks ini: [Klik Untuk Buka] menjadi gambar atau kode <img.

Tapi kalau postingan dengan show hide banyak, Admin saranin jangan pakai ini, Di jamin kalian bakal repot pakai banget plus mumet plus pengen mabok plus depresi plus jadi bunuh diri... Bahaya kan?? wokoko..

Terimakasih sudah berkunjung,

Posting Komentar untuk "Membuat Tombol Show Hide Dengan Text Link & Gambar Sederhana"