03 March 2010
Buat Effect Image Blur
hak milik
Sue
Assalmualaikum , Petang ini msue nak kongsi ngan korang bagaimana nak buat image blur dan apabila mouse di letakkan pada image , imej akan menjadi normal kembali .
1. Login ke Blogspot .
2. Klik Layout - Edit HTML(Tandakan pada Expand Widget)
3. Cari kod di bawah(Gunakan CTRL+F untuk memudahkan korang mencarinya .
]].></b:skin>
4. Copy dan pastekan kod dibawah diatasnya .
.linkopacity img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.linkopacityxtra:hover img {
filter:alpha(opacity=1.1);
-moz-opacity: 1.1;
opacity: 1.1;
border:0;
}
4. Preview dan Save Template jika tiada error.
5. Klik setting - formatting .
6. Copy kod dibawah dan pastekan kedalam post template seperti image dibawah .
<a href="http://msueroomz.blogspot.com" class="linkopacity"><img src="URL IMAGE"></a>
7. Save setting .
Note: Pada highiligt korang tukarkan dengan yang bersesuaian ketika setiap kali korang nak letakkan gambar pada posting korang .
1. Login ke Blogspot .
2. Klik Layout - Edit HTML(Tandakan pada Expand Widget)
3. Cari kod di bawah(Gunakan CTRL+F untuk memudahkan korang mencarinya .
]].></b:skin>
4. Copy dan pastekan kod dibawah diatasnya .
.linkopacity img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.linkopacityxtra:hover img {
filter:alpha(opacity=1.1);
-moz-opacity: 1.1;
opacity: 1.1;
border:0;
}
4. Preview dan Save Template jika tiada error.
5. Klik setting - formatting .
6. Copy kod dibawah dan pastekan kedalam post template seperti image dibawah .
<a href="http://msueroomz.blogspot.com" class="linkopacity"><img src="URL IMAGE"></a>
7. Save setting .
Note: Pada highiligt korang tukarkan dengan yang bersesuaian ketika setiap kali korang nak letakkan gambar pada posting korang .
