Just another WordPress.com site

>

Tutorial blog kali ini adalah membuat hover pada gambar atau di sebut juga cara mengatur transparansi gambar pada blog. Fungsi dari Tutorial ini adalah jika cursor mouse menyorot / atau berada pada salah Satu gambar pada blog, maka gambar tersebut akan menyala / buram pada tampilan blog pada postingan. Coba arahkan kursor / mouse pada gambar dibawah ini maka akan terlihat buram.
Diatas adalah contohnya. Caranya :

1. Pilih gambar yang akan digunakan
2. Setelah itu upload ke internet, kalau belum tahu caranya silahkan klik cara-mendapatkan-url-gambar-untuk-blog
3. Setelah di-upload, Anda akan mendapatkan URL gambar tersebut
4. URL gambar tersebut harus Anda sisipi dengan kode berikut ini :
onmouseover=”this.style.opacity=0.4;this.filters.alpha.opacity=40″
onmouseout=”this.style.opacity=1;this.filters.alpha.opacity=100″ style=”opacity:1;filter:alpha(opacity=100)”
5. Berikut adalah contoh code untuk dipasang pada postingan, warna merah adalah URL gambar.
<img onmouseover=”this.style.opacity=0.4;this.filters.alpha.opacity=40″
onmouseout=”this.style.opacity=1;this.filters.alpha.opacity=100″ style=”opacity:1;filter:alpha(opacity=100)” src=”https://teamjabal.files.wordpress.com/2010/07/gadis_berjilbab1.jpg?w=224″/></a&gt;
6. Selesai

Iklan

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

Awan Tag

%d blogger menyukai ini: