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. ^_^
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.
.jpg)
7 Comments:
mesti ckin rajin kan sampai tahu banyak benda macam ni. kalau akak memang tak reti la..huhu...
nur anis,
hehe..rajin..rajin..yg mudah2 je la... ^_^
cik pon ade buat ni.hehe
oit..nak copy kt ats or bwh head.k.suzie xnmpk plk ckin suh paste kt ner..hihi
kak suzie,
paste kat bawah head tu akak..hehe
ohh.. kat sini rupenye.. terus terbace entri yg latest tnpa menyedari entri yg lame menceritakan segalanya...huhu
Ibnu Darwin,
yup..kat sini.. ^_^ bolehla amik naa..hehe
Post a Comment