Membuat 'hover' di posting

Hari ini aku nak buat entri ala-ala tutorial di bawah label bagaimana. Banyak juga aku buat entri di bawah label ni, bagaimana nak tu la, bagaimana nak ni la.. Macam ye ye or.

Cuba korang halakan penunjuk tetikus (atau tap) ke tajuk di petak kecil di bawah.

...Kisah dulu ..

.. berbulan-bulan aku merana, tidur tak lena tetapi kenyang bila makan dan tak basah cuma bila tak sedang mandi. Begitu juga dengan mata ku, takda masalah. Tapi aku terasa dunia ni gelap. Fikiran ku buntu, dada ku sebak.

Gambar hiasan
Jam tu lah aku berangan jadi Superman untuk menipu jiwa ku yang tak menentu agar bersemangat semula. Aku akan mendapatkan A. Kalau tunangnya menghalang, aku jentik aje telinga dia.. hek eleh, tersungkur. Tu aku baru jentik sikit. Kemudian aku bawak A terbang jauh.. padan muka. Dulu dia rampas kekasih aku, nah sekarang aku rampas tunang dia.

Contoh tamat.

Keseluruhan teks yang tersorok akan terpapar. Menurut apa yang aku rujuk di w3schools.com dan beberapa laman web lain, kesan ini dinamakan 'hover'.

Di bawah, contoh kode yang ku buat. Kepada yang belum tau dan berminat, boleh la copy/paste kode ke HTML/Javascript atau HTML post korang.

Kepada yang lebih arif harap beri pandangan. Sekian, selamat malam.. err.. selamat pagi. Dah pukul 2.00 pagi aku siapkan posting ni.

<div id="orb01">
Tukar teks berwarna merah ini dengan teks korang. Tukar juga yang ini, yang ini, yang ini, yang ini, yang ini, yang ini, yang ini, yang ini, yang ini, yang ini, yang ini dan yang ini juga, dengan teks korang.</div>
<style type="text/css">
#orb01 {
background-color: #dddddd;
margin: 0 auto;
border: 1px #999999 solid;
padding: 10px;
height: 10px;
overflow: hidden;
width: 110px;
}
#orb01:hover {
height: 100%;
width: 344px;
}
</style>

Ulasan