Menyembunyikan konten tertentu dari sebuah halaman website terkadang diperlukan untuk menghemat space. Ketika visitor ingin melihatnya mereka dapat dengan mudah menampilkannya. Dalam software forum semacam vBulletin, hal ini disebut dengan Spoiler.

Berikut adalah contoh penggunaan spoiler.

Bagaimana cara membuatnya? Hanya diperlukan sedikit kode javascript yang langsung diembed di kode html.

Ini adalah konten yang disembunyikan, klik tombol Sembunyikan/Tampilkan untuk membuka atau menutup konten ini.

Barangkali kita pernah berfikir bagaimana caranya membuat elemen halaman website kelihatan transparan (tembus pandang) terhadap elemen dibelakangnya. Ini biasanya digunakan pada menu dropdown ataupun elemen div untuk mempercantik halaman website.

Melanjutkan trick css sebelumnya, berikut ini adalah tips untuk membuat elemen transparan tersebut, yang tentu saja bersifat crossbrowser alias dilihat dari browser manapun akan menghasilkan tampilan yang sama.

Misalkan kita akan membuat sebuah elemen div bernama #kotak (div id=”kotak”) menjadi transparan, hal yang perlu dilakukan adalah dengan menambahkan properti berikut pada CSS.

div#kotak {
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}

Nilai yang dapat diberikan antara 0 s/d 1 untuk -moz-opacity dan opacity, sedangkan untuk filter:alpha(opacity adalah 0 s/d 100. Semakin tinggi nilai opacity maka elemen akan semakin jelas terlihat, sementara semakin rendah nilainya, sebuah elemen akan nampak makin transparan.

Selamat mencoba