Tuesday 31 May 2011

Tutorial Gambar Zoom Effect

Posted by aen ashiqin on 02:14. - 2 comments


Hari ini aen nak tunaikan janji aen..Selalunya jarang kita tengok gambar Zoom efek ni di mana² blog. kod ni buat gambar korg nampak lebih bagus dan unik. Biasa bila korg klik gambar,korg akan pergi ke page url gambar itu,ini lebih menyusahkan nak load page apa lagi masa line lambat. Selepas korg guna kod Zoom efek,pada saat ini ketika pengguna klik pada gambar yang anda upload di blog anda, mereka mengklik ke laman URL imej yang baru gambar pada halaman kosong. berikut kita lihat beberapa DEMO :

Jom tutorial..

1. sign in blogger..Dashboard. klik Design.

2. Edit HTML.

3. Download Full Template

4. klik Expant Widget Templates.



5. Cari kod ini </head> menggunakan fungsi find. tekan ctrl+F serentak.

6. Copy kod di bawah dan paste di atas kod </head> tadi.


<script src='http://sites.google.com/site/aenashiqin/aen/FancyZoom.js' type='text/javascript'/>
<script src='http://sites.google.com/site/aenashiqin/aen/FancyZoomHTML.js' type='text/javascript'>
</script>





7. Mengunakan fungsi find ctrl+F.
Cari kod ni <body expr:class='"loading" + data:blog.mobileClass'>

kalau tidak jumpa kod di atas,cari kod ini <body>

8. Padam kod <body>,
gantikan dengan kod ini <body onload="setupZoom()"> atau buat macam ini:
<body expr:class='"loading" + data:blog.mobileClass' onload='setupZoom()'>



da siap,Save Template.


ok..langkah pertama da siap.
Sekarang korg dapatkan url gambar korg,cara nak dapat url gambar klik sini.


<a href="URL GAMBAR"><img height="300" src="URL GAMBAR" width="300" border="0" alt="aenashiqin" style="padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; " /></a>

korg boleh ubah saiz gambar menjadi lebih besar atau kecil dengan mengubah height="250" width="200".

2 comments:

[im]http://i.imgur.com/QV70L.jpg[/im]
[ma][co="pink"]sila la komen..jgn malu2.[/co][/ma]

[im]http://i.imgur.com/KAtiL.gif[/im]
takutnyerrrrrrr....

Post a Comment

LinkWithin

Related Posts Plugin for WordPress, Blogger...