BuaT Mouse EffecT

cara membuat MouseOver Effect di blog, Apa itu MOuseover Effect, ya intinya effect yang akan keluar jika kita sorot gambar dengan mouse.

Cara kerja efek gambar transparan diatas tidak begitu sulit, yang kita perlukan hanya memanfaatkan properti CSS Image Opacity. Namun sebelumnya perlu juga diketahui property CSS opacity sebenarnya tidak termasuk dalam standar CSS, dimana property ini hanya bekerja dengan baik pada beberapa web browser modern saja ( dikutip : O-Om )

Atau biar lebih jelaz coba aja lihat contoh gambar dibawah ini, hasil dari Effect MouseOver opacity pictures (tunjuk Gambar dengan mouse agar terlihat EffecT 0pacitY nya) :


1. Mouse OverEffect Opacity imageI ( Opacity dari Buram ke Jelaz )

Untuk membuat Effect Opacity gambar diatas copy script dibawah ini :

<img src="Masukkan URL Gamabar Anda Disini" style="opacity:0.2;filter:alpha(opacity=40)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />

2. Mouse OverEffect Opacity image II ( Opacity na dari Jelaz ke Buram )

Untuk membuat Effect Opacity gambar diatas copy script dibawah ini :

<img src="Masukkan URL Gamabar Anda Disini" border="1" style="opacity:1;filter:alpha(opacity=100)"onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=40"onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100"/>

tetapi ini mungkin tidak akan support sama semua browser, tapi kalo browser modern seperti MOzilla Firefox n dll pazti bisa


TERIMAKASIH

• 
• 
• 
• 
• 
• 
•