CSS Image Opacity (Efek Transparent Pada Gambar)

http://t3.gstatic.com/images?q=tbn:ANd9GcTP3aRali36aBc0mx0Dtr7jX5tMPnxmBW01g8DItB_77IQMkRdOKw&t=1
Assalamualikum,
Kali ini kita akan membahas tentang Efek gambar Pada CSS. Sesuai Judul, kita akan melakukan efek Transparent pada Gambar saat di sorot maupun sebaliknya.
ya, langsung aja sob, udah malem nih.
Cekibrottt -->


1. Login Blogger
2. Rancangam --> Edit HTML (Jangan Lupa Backup template dlu)
3. Cari tag ]]></b:skin>
4. Masukan Code CSSdi bawah ini di atas Tag ]]></b:skin>

.img_opacity{
opacity:0.4;
filter:alpha(opacity=40);
}
.img_opacity:hover{
opacity:1.0;
filter:alpha(opacity=100); /
}
Keterangan diatas menandakan bahwa Code berwarna biru adalah, efek Gambar saat Transparan, sobat bisa mengaturnya sendiri, Pada umumnya Browser Mozzila Dan IE normalnya hanya sampai 1.0, jadi Sobat hanya boleh menambahnya sebanyak 0.1, lalu code berwarna Ungu itu adalah efek yang dihasilkan jadi jika Opacitynya 0.1 Alphanya harus 10
Sedangkan pada Hover yang di hasilkan terdapat Code warna Hijau itu adalah Efek Normal dari sebuah gambar, jadi Efek normalnya adalah dengan Opacity=0.1 Dan Alphanya=100.

5. Simpan Template Sobat.
6. Panggil Baris Code CSS tersebut dengan menggunakan Code HTML, ya iyalah itu udah wajibnya, gk boleh di ganggu gugat wakakaka ..

<a class="img_opacity" href="http://forbiden-403.blogspot.com"><img  border="0" src="URL Gambr Loe" /></a>




DEMO

12 ... Skip ke Kotak Komentar

8 Maret 2012 18.11

nice tutor sob

13 Maret 2012 22.08

sipppp... sampek bingung saya bang muter2 di template abang ini...hehehe

15 Maret 2012 15.53

Selamat sore kawan, Sebelumnya maaf jika komentar ini melenceng dari artikel. Jika dianggap spam, maka hapuslah. Saya hanya memberitahu. Sudah lama saya tidak blogging lagi. karena sibuk dengan dunia nyata. dan kali ini saya sempatkan untuk mengunjungi sahabat agar masih tetap terjalin hubungan antar sesama blogger.

Terima kasih.

17 Maret 2012 05.32

Kunjungan pagi sobat...

Nice share!

27 April 2012 14.50

CSS nya keren nih sahabat

21 Mei 2012 00.29

saling follow yukz :D

Wah keren abis nih artikelmu sob..
sangat bermanfaat..
thx ya :)


#Happy Blogging :D

19 Juni 2012 16.49

terima kasih infonya sob.
sungguh kreatif sekali dan template blog anda simple.
dan sepertinya anda mempunyai kelebihan tersendiri.
bila ada waktu saya akan berkunjung lagi sob :)


#Semoga Sehat Selalu :)

25 Juni 2012 09.28

Lama ga kemari nih bang,mantef tuh tutornya..hahahahyyyy

4 Mei 2014 21.00

Blogwalking Sob(y) Nyimak deeh :D

Cara Mendapatkan Baclink berkualiast --> http://www.ariiff-rahman.com/2012/11/dalam-seo-search-engine-optimization.html
Cara Menaikan Page Rank --> http://www.ariiff-rahman.com/2012/09/cara-cepat-menaikkan-pagerank-dan.html

5 Juli 2015 10.53

Pengen yang lebih seru ...
Ayo kunjungi www.asianbet77.com
Buktikan sendiri ..

Real Play = Real Money

- Bonus Promo Red Card pertandingan manapun .
- Bonus Mixparlay .
- Bonus Tangkasnet setiap hari .
- New Produk Sabung Ayam ( minimal bet sangat ringan ) .
- Referal 5 + 1 % ( seumur hidup ) .
- Cash Back up to 10 % .
- Bonus Royalty Rewards setiap bulan .

untuk Informasi lebih jelasnya silahkan hubungi CS kami :
- YM : op1_asianbet77@yahoo.com
- EMAIL : asianbet77@yahoo.com
- WHATSAPP : +63 905 213 7234
- WECHAT : asianbet_77
- SMS CENTER : +63 905 209 8162
- PIN BB : 2B4BB06A / 28339A41

Salam Admin ,
http://asianbet77.com/

Tambahkan Komentar Anda

Peraturan :
1. Dilarang berkomentar dengan kata-kata yang kotor, Pornografi, SARA
2. Dilarang Poskan Spam
3. Dilarang poskan URL yang tidak perlu
Sekian Pemberitahuan Dari Saya
Hati-hati dengan Komentar Anda, anda Komentar Bukan Spam, Saya Pasti akan Follow anda, This Blog Dofollow

 
Yahoo Messenger
Send Me IM!
Google Plus
Add Me To Your Circle!
Twitter
Follow Me!
Facebook
Add My Facebook
Original Template By Belajar SEO Blogspot - Himajiesized By Dayz Hidayat - Converted By [./Forbiden-403]