Ditulis oleh: Ditulis pada: 8/07/2014
Lagi iseng-iseng ngecek speed blog di PageSpeed Insights, tertarik juga untuk membuat show hide content-nya yaitu show hide yang menampilkan masalah-masalah pada blog yang harus diperbaiki. Pasti Anda semua sudah mengetahu show hide content tersebut yang ada di PageSpeed.
Itung-itung menambah koleksi macam-macam show hide content, maka kali ini saya mencoba membuat show hide content ala Google ini dengan versi saya dengan bantuan jquery.
Bagi yang tertarik untuk mencobanya, silahkan coba dan copy kode-kodenya pada iframe JSFiddle di bawah ini.
Perhatikan pada kode css .text-area p dengan tinggi (height) auto, sehingga tinggi teks areanya mengikuti banyaknya content yang dibuat. Jika Anda ingin menentukan tinggi teks areanya maka tinggal ganti kode auto pada height dengan angka pada satuan px seperti contoh 80px. Dan tambahkan kode overflow: auto untuk konten yang melebihi tinggi yang kita tentukan, seperti pada iframe JSFiddle di bawah ini.
Dan satu lagi saya juga membuat show hide content yang banyak digunakan di forum-forum Google seperti pada iframe JSFiddle di bawah ini.
Karena ini menggunakan jquery, maka template Anda wajib memasang jquery library berapa pun versinya seperti di bawah ini. Jika sudah ada maka abaikan ini.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'></script>Selamat mencoba...