Sampaikanlah dariku walau sepotong ayat (Muhammad s.a.w.)

Powered by Blogger.

Tutorial Gambar Membesar Disentuh Cursor ^_^

Monday, January 30, 2012

Assalamualaikum semua!

Perasan tak, bila cursor menyentuh gambar-gambar dalam blog Ckin ni, then gambarnya jadi besar gedabak? ^_^ Menarik? Bagi Ckin menarik la. Sebab special punya version. Chewah! Act, ada masalah dengan tutorial kali ni. Bila Ckin taip balik kod-kod html kat sini, automatik tak kuar dah kat blog. I don't know why! So, Ckin bagi link sahabat blogger kita naa. Kalian boleh rujuk terus di sana. Tapi, ada sedikit yang boleh Ckin share. Harap dapat membantu. ^_^

1. Buka Dashboard > Template > Edit Html

2. Tick Expand Widget Templates.

3. Tekan F3 atau  Ctrl+F. Search <head> macam kat bawah ni. (ikut sebijik-bijik k)


4. Kemudian, copy kod di link ini. Pastekan di bawah perkataan head tadi.

<style>
.post img:hover {
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-webkit-transform: scale(1.2); }
</style>

5. Kemudian, kita boleh edit nak bagi besar mengikut keinginan kita. Rujuk di bawah naa. Cuma perlu tukar scale di bawah. Makin besar nombor nisbahnya, makin besar gambar akan muncul. Ckin cuma ambil 1:5. Dah cukup besar. Kalu besar sangat nanti gambar lagi kabur. ^_^


6. Dah siap, preview. Kalu jadi, save naa.

Itu sahaja tutorial ringkas dan mudah. Selamat mencuba semua! Wassalam.

Kalau tak jadi, boleh tanya. Kalu Ckin boleh bantu, Ckin bantu.. ^_^

Thanks for sahabat baru Ckin ni iaitu Farah. Nak ziarah dia, boleh klik sini. 

7 Comments:

nur anis January 30, 2012 at 2:58 PM  

mesti ckin rajin kan sampai tahu banyak benda macam ni. kalau akak memang tak reti la..huhu...

Ckin Kembaq January 30, 2012 at 2:59 PM  

nur anis,

hehe..rajin..rajin..yg mudah2 je la... ^_^

suzie rahman January 30, 2012 at 10:12 PM  

oit..nak copy kt ats or bwh head.k.suzie xnmpk plk ckin suh paste kt ner..hihi

Ckin Kembaq January 30, 2012 at 10:33 PM  

kak suzie,

paste kat bawah head tu akak..hehe

Ibnu Darwin January 31, 2012 at 11:51 PM  

ohh.. kat sini rupenye.. terus terbace entri yg latest tnpa menyedari entri yg lame menceritakan segalanya...huhu

Ckin Kembaq February 1, 2012 at 8:10 AM  

Ibnu Darwin,

yup..kat sini.. ^_^ bolehla amik naa..hehe

Post a Comment

اَلسَّلَامُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَا تُهُ

Kongsikan idea dengan saya di sini. Ianya adalah pencetus semangat! ^_^

Newer Posts Older Posts Home
Related Posts with Thumbnails


  © Blogger template On The Road by Ourblogtemplates.com 2009

Back to TOP