Membuat Show dan Hide Pada Postingan Blog

Banyak jenis show hide div ini, dan di sini saya akan share cara membuat salah satunya yaitu show hide div yang sederhana di postingan seperti yang bisa Anda lihat pada gambar gif di bawah ini.
Bagi yang mau mencobanya silahkan gunakan kode HTML di bawah ini, silahkan gunakan pada post editor HTML.

<div

id="Button" style="margin:0 auto;text-align:center">

<input

type="button"

onclick="document.getElementById('Content').style.display='block';Button.style.display='none';"

value="Klik Disini Untuk Melihat" />

</div>

<div

id="Content"

style="display:none;width:300px;padding:10px;margin:0 auto;border:1px

solid #aaa;text-align:center;box-shadow: 0px 1px 3px 0px

rgba(179,179,179,1);background:#fff">

<p>

SILAHKAN

SIMPAN TEKS ATAU GAMBAR ANDA DI SINI

</p>

<input

type="button" onclick="document.getElementById('Content').style.display='none';Button.style.display='block';"

value="Close" />

</div>

Contoh

SILAHKAN SIMPAN TEKS ATAU GAMBAR ANDA DI SINI

Sekian Dulu Posting dari Dunia Rahul semoga bisa membantu

Silahkan Komentar jika Link download tersebut Rusak
Wasslamu'alaikum Wr. Wb.