Membuat Efek Besar Pada Gambar saat terkena Mouse

Sekedar BerBagi ini akan menjelaskan Maksud dari "Membuat Efek Membesar Pada Gambar/Image"penjelasaannya sebagai berikut :

    *Gambar Akan membesar Apabila tersentuh oleh kursur/Mouse
    *Gambar Akan merotasi dengan sendirinya Apabila tersentuh oleh kursur/Mouse

Kalau memang belum jelas silakan sentuh gambar d bawah ini dengan mouse/kursor sobat.Nah sekarang ke bagian tutorialnya langsung ke TKP :

1. Masuk ke akun blogger.com
2. Dashboard silahkan anda Pilih Rancangan
3.Pilih Edit HTML
4.Kalau sudah centang dulu "Expant Template Widget"/atau backup Dulu template sobat sebelum ada apa2
5.Cari deh Kode ]]></b:skin> (Ctrl+F)

    Letakkan kode berikut ini tepat di atas ]]></b:skin>

.memput:hover{
-moz-transform:rotate(22.5deg) scale(1.10);
-webkit-transform:rotate(22.5deg) scale(1.10);
}

Langkah terakhir adalah menyimpan template dengan klik aja "save"
Namun Tutorial Cara Membuat efek besar pada gambar saat terkena mouse belum selesai sampai disini sekarang kita langsnug ke Tahap kedua untuk mamanggil kode tersebut.
Ini Dia Kode tata cara meletakkan kode untuk memanggil kode tersebut dan memberikan efek pada gambar:

<img class="memput" src="http://i783.photobucket.com/albums/yy114/rrezkijitawwa/bannerrrrrrr.png" />

Sisipkan kode "memput" untuk memberikan efek pada Image/Icon yang ada sedangkan tulisan tebal adalah alama URL gambar Sobat.

Untuk Membuatnya Menjadi Link Kodenya seperti di Bawah :

<a href="Link Anda Di Sini"><img class="memput" src="http://i783.photobucket.com/albums/yy114/rrezkijitawwa/bannerrrrrrr.png" /><a/>

Begitulah warna hijau dapat sobat ganti dengan link yang sobat bisa tuju.

Sekian dulu artikel dari Sekedar Berbagi kali ini. semoga bermanfaat bagi kita semua..

2 komentar :

jhonson mengatakan...: Gan, ane mau nanya.
tuh kan gambar nya mutar n membesar efek klo kena cursor nya, nah yg ane mau tanya gmana ya gan klo gambarnya berubah jadi tranparant jka terkena cursor.
conth webnya : www.thefancy.com

makasih ya gan, maklum newbie ^^v
GBU; 9 Agustus 2012 pukul 22.59
Ngkuy Baelah Salamilamina mengatakan...: mungkin yang anda maksud dalam contoh pada web www.thefancy.com adalah efek blur atau efek hover pada gambar,,klo pengen seperti itu coba cari di pencarian membuat gambar dengan efek hover.

smoga jawaban ini membantu.; 7 September 2012 pukul 18.43