Tutorial : Marquee Reverse Back Image Hover

Assalamualaikum and annyeong!

So, hari ni NS nak share tutor image hover. But, yang ni jenis reverse back hover yang sangat sesuai kalau korang nak letak iklan or ads kat dalam blog korang. Dipendekkan cerita, kalau korang nak promote sumthing special gitu, korang bolehlah warwarkan kat ruangan tue. Hahaha. Kalau nak tengok preview, sila klik link kat bawah, yup!

{ LIVE PREVIEW }

Let's go, babeh~

1. Dashboard > Layout > Add a Gadget > Html/JavaScript

2. Copy ke semua kod di bawah.

<center>
<div style="border: 4px solid #D8D8D8; padding: 2px; width: 600px;">
<div style="text-align: center;">
<marquee behavior="alternate" direction="left" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="5">
<a href="URL LINK"><img height="100" src="URL IMAGE" width="100" /></a>
<a href="URL LINK"><img height="100" src="URL IMAGE" width="100" /></a>
<a href="URL LINK"><img height="100" src="URL IMAGE" width="100" /></a>
</marquee></div>
</div>
</center>

Nota kaki :

*biru : ketebalan boarder korang

*oren : jenis boarder solid | dashed | dotted

*pink : warna boarder boleh dapat kat SINI

*purple : URL LINK

*merah : URL IMAGE

3. Then, pastekan dalam kotak yang disediakan.

4. Kalau dah puas hati, bolehlah SAVE!