Welcome to my blog. Feel free to read my stories and etc. I rarely update this blog. Sixteen.


home. | le owner. | stuff. | affiliates. | flavors. | chatbox.

Isnin, 6 Jun 2011

Tukar Gambar Apabila Dilakukan oleh Cursor

Memasang gambar yang boleh bertukar semasa dilalukan cursor di blog mungkin boleh menambah sedikit kelainan pada blog anda. Dan juga gambar yang disertakan dengan link boleh menarik sedikit perhatian.



Contohnya, cuba lalukan cursor anda pada gambar di bawah.






Tutorial adalah seperti berikut.

1. Gunakan kod di bawah, tukarkan link yang anda mahu, url gambar pertama dan url gambar kedua.Nie untuk tab menu mcm saye ea...

<a href="Target link" target="_blank"><img src="URL gambar pertama" onmouseover="this.src='URL gambar kedua'" onmouseout="this.src='URL gambar pertama'" /></a>

Contoh untuk kod untuk demo di atas adalah

<img src="http://1.bp.blogspot.com/-Utohj8TIO6I/TeyCKlSVvsI/AAAAAAAAAPU/YDLw6dRZEmQ/s1600/hover+sini.jpg" onmouseover="this.src='http://3.bp.blogspot.com/-cZlQFgVUsVE/TeyCKDep1jI/AAAAAAAAAPQ/ymJSAjSsCUU/s1600/akw+ofd.jpg'" onmouseout="this.src='http://1.bp.blogspot.com/-Utohj8TIO6I/TeyCKlSVvsI/AAAAAAAAAPU/YDLw6dRZEmQ/s1600/hover+sini.jpg'" />


 2. Anda boleh post di dalam entri blog anda seperti biasa ataupun boleh letakkan di sidebar.


Senang dan mudah bukan???


Nota kepala : Jika mahu gambar sahaja tanpa link, kodnya seperti dibawah....


<img src="URL gambar pertama" onmouseover="this.src='URL gambar kedua'" onmouseout="this.src='URL gambar pertama'" />


 Selamat mencuba....


Credit : Tutorial untuk Blog



7 ulasan:

Syakirah ✿ berkata...
Ulasan ini telah dialihkan keluar oleh pengarang.
Syakirah ✿ berkata...

Kak , cmne klu nk buad ni kat header ? x reti ^^

Farahin berkata...

@Syakirah ✿ : nanti sye wt tuto k

Syakirah ✿ berkata...

ohh , okay ! tenxx ! sygg akk~

Farahin berkata...

@Syakirah ✿ : samesame .

nurul rabiatul adawiyah berkata...

TERIMA KASIH....

Farahin berkata...

@nurul rabiatul adawiyah : samesame .