Tukar Gambar Apabila Dilalukan Cursor

Posted on 8:02:00 PM by  with 41 comments
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. (Dan juga boleh klik untuk ke blog ohbest)





Tutorial adalah seperti berikut.

1. Gunakan kod di bawah, tukarkan link yang anda mahu, url gambar pertama dan url gambar kedua.

<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

<a href="http://ohbest.blogspot.com" target="_blank"><img src="http://i.imgur.com/Z5B1M.png" onmouseover="this.src='http://i.imgur.com/PlE1J.jpg'" onmouseout="this.src='http://i.imgur.com/Z5B1M.png'" /></a>



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


Senang dan mudah bukan.?.:)


Nota: 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.:)

41 comments:

  1. Falling .May 31, 2011 at 8:07 PM

    wahhhhh menarik lah!!!!!!!

    ReplyDelete
  2. Danish Shah (Den)May 31, 2011 at 8:09 PM

    terbaek lol !

    ReplyDelete
  3. AnonymousMay 31, 2011 at 8:45 PM

    this best bro...best bro...

    ReplyDelete
  4. umi kokmieMay 31, 2011 at 10:24 PM

    menarek gilewwww

    ReplyDelete
  5. Orang KampungMay 31, 2011 at 11:24 PM

    menarik..

    ReplyDelete
  6. umi kokmieMay 31, 2011 at 11:29 PM

    awesome weh..
    tapi, code yang di bagi kat no 1 tu, ade slack sikit lah..cube try check balek..tq

    ReplyDelete
  7. UnknownMay 31, 2011 at 11:29 PM

    dah try,, x bley resize la. bley ajar x camna nak resize?? Please.. Tlong ajar kat shoutbox www.twilleries.blogspot

    ReplyDelete
  8. UnknownMay 31, 2011 at 11:31 PM

    lpas tu, camna nak buat benda ni kat entry blog. dah try, tapi kuar url ja

    ReplyDelete
  9. unMay 31, 2011 at 11:47 PM

    umi kokmie.
    Thanks coz bagitahu. Tak perasan ada tertinggal lak sebelum ni.
    Thanks.

    ReplyDelete
  10. Aynaa AzizJune 2, 2011 at 2:22 AM

    knp xboleh :(

    ReplyDelete
  11. Murni YusoffJune 3, 2011 at 6:31 PM

    thanx...=)

    ReplyDelete
  12. wawa_addienJune 5, 2011 at 3:07 PM

    mcm mane nk wt 'show all' kt dlm bloglist kita? sbb skrg nie bloglist wawa jd panjang sgt n serabut laa plak. klu dpt di 'show all' kan lg cantik..help me plzzz

    ReplyDelete
  13. WuMingJune 7, 2011 at 2:46 PM

    Wow... best woo macam tuu...

    ReplyDelete
  14. bopfive5June 7, 2011 at 7:23 PM

    siiip coba ya kak thanks

    ReplyDelete
  15. penemuan luar biasaJune 7, 2011 at 11:40 PM

    haa..mmg best luar biasa!!

    ReplyDelete
  16. penemuan luar biasaJune 7, 2011 at 11:42 PM

    mmg luar biasa entry nih..huhu

    ReplyDelete
  17. MOMOY chanJune 14, 2011 at 1:58 PM

    best tapi pix mesti resize dahulu ker?

    ReplyDelete
  18. anakutbanjarJune 15, 2011 at 6:36 AM

    boleh jg nanti kita coba,
    sekalian nitip promosi yah untuk yang ingin dapat uang tambahan silahkan klik
    http://www.penasaran.net/?ref=sbgjxe
    kerjaan entri data perdata yang di entry kita dapat bayaran 10.000

    ReplyDelete
  19. JEIKHAJune 18, 2011 at 11:32 PM

    done ! semadd doe , thanks yaw

    ReplyDelete
  20. AnonymousJune 19, 2011 at 11:08 PM

    thanks yer

    ReplyDelete
  21. Am!rul Rasy!dJuly 17, 2011 at 4:16 PM

    kenape aku wat x ley? x adill

    ReplyDelete
  22. NuRhiDAyah N NAzriEAugust 4, 2011 at 3:56 PM

    nk cri link 2 pening r

    ReplyDelete
  23. Mr. SyokAugust 8, 2011 at 4:17 AM

    menarik yg ni... aku da cuba & sukses.. hehe

    ReplyDelete
  24. arety izzatiEySeptember 18, 2011 at 10:09 AM

    nape x jadi sy wat

    ReplyDelete
  25. AzianeemmaliseNovember 3, 2011 at 12:09 PM

    menarik

    ReplyDelete
  26. Amira Mohd ShukorNovember 7, 2011 at 12:02 PM

    kenapa jd bsar?

    ReplyDelete
  27. nabilahnafi :)November 26, 2011 at 2:28 PM

    Code tu nak paste kat mana?
    Ajar laa, ajar laa :(

    ReplyDelete
  28. NurSyamimiIshakNovember 29, 2011 at 6:28 PM

    salam..mcm mna nk dptkn url dri lam kmputer..cntohnye nak msukkn gmbar dri pc kita seniri

    ReplyDelete
  29. Cek AnaDecember 1, 2011 at 12:26 PM

    style

    ReplyDelete
  30. Isya Lovely GurlzDecember 16, 2011 at 11:44 PM

    x phmmm

    ReplyDelete
  31. LIYANADecember 20, 2011 at 7:12 PM

    mcmne nk buat kat smua gmba ?tkkn la nk edit smua post kot .

    ReplyDelete
  32. ayiT's LifeDecember 30, 2011 at 1:44 PM

    nice..tp x kn 2 pic je

    ReplyDelete
  33. UnknownMay 30, 2012 at 12:05 AM

    mcm mna nk buat jam pada cursor tu?

    ReplyDelete
  34. Nurhanani binti Md.ZambriJune 30, 2012 at 12:58 PM

    nice~~

    ReplyDelete
  35. bOoDaK BanYaK cERiTaOctober 11, 2012 at 3:53 PM

    awk...x jd pon...

    ReplyDelete
  36. iezmanariesDecember 15, 2012 at 10:54 PM

    dah cuba tak jadi... dah ikut mcm mcm, photo bucket mana satu link yg boleh guna hadoiii pening nampak cam simple tapi separuh gilerr beb

    ReplyDelete
  37. iezmanariesDecember 15, 2012 at 10:59 PM

    tlg chekkan http://thealmightythecreator.blogspot.com/

    http://feltcreativezone.blogspot.com/

    ReplyDelete
  38. AnonymousDecember 23, 2012 at 12:38 AM

    Ohsemm!!

    ReplyDelete
  39. Syasya WyneAugust 6, 2013 at 11:49 PM

    Nak save kat mana? kat template eh?

    ReplyDelete
  40. AnonymousDecember 2, 2013 at 1:29 PM

    thank its working!!

    ReplyDelete
  41. UnknownJune 29, 2014 at 6:16 PM

    salam..mcm mna nk dptkn url dri lam kmputer..cntohnye nak msukkn gmbar dri pc kita seniri
    Tutorial Blog

    ReplyDelete

Subscribe to: Post Comments (Atom)