Assalamualaikum
Nak kasi tutor yang di request oleh DIBA yang comel loteyy nie :)
Macam mana nak kasi gambar korang jadi besar bila cursor menyentuh gambar tu dan sekaligus gambar tu jadi blurr? Atau dalam bahasa pendeknya Tutorial Hover Zoom Smooth Picture. Hehe :)
Credit to Amalina Land! :D
Faham tak? Ok contohnya, cuba korang halakan cursor korang kat gambar di bawah nie
Gambar Dinner kitorang :)
Credit picture to El Ferdowsi
See? Gambar tu jadi besar dan blurr kan? So aku nak kasi tutorial dekat korang lah nie :)
- Dashboard > Design > Edit HTML
- Tekan ctrl + f dan cari code kat bawah ini
<head>
- Copy code di bawah ini dan pastekan di BAWAH code yang korang 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); }Sumber : http://farixsantips.blogspot.com/2011/06/effect-hover-zoom-smooth-pada-object.html#ixzz1X07HXoVg</style>
- Sebelum save, preview lah dulu ye? Kalau tak ada error, save je terusssssss! :D
- Dah siap! :D
Dah menjadi, bagitahu ehh? :)
More tutorial HERE!
7 comments