Efek Blur akan terjadi apabila cursor melintas pada objek tersebut.
Efek ini berlaku untuk semua objek gambar, baik itu gambar yang disertai dengan link ataupun gambar yang tidak disertai dengan link.
Cara memasangnya sebagai berikut :
Login ke Blogger
Klik Tata Letak
Klik tab Edit HTML
Klik tulisan Download Template Lengkap.
Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
Beri tanda centang pada kotak di samping tulisan Expand Template Widget,
Tunggu beberapa saat ketika proses sedang berlangsung
Silahkan sobat cari kode ]]></b:skin>
Jika sudah ketemu letakkan code berikut diatasnya
===================================================================
.linkopacity img {filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; border:0;}
.linkopacity:hover img {filter:alpha(opacity=30); -moz-opacity:0.3; opacity:0.3;border:0;}
===================================================================.linkopacity:hover img {filter:alpha(opacity=30); -moz-opacity:0.3; opacity:0.3;border:0;}
Kemudian Simpan Template.
Berikut contoh penerapan :
Gambar biasa
Kode script
===================================================================
<a href="http://www.sazlina.co.cc/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBwV9mQ4WKfVBP69hBPI0dd_5w6uh2HN-shawyWP0LwkDIJYTYeMvVxPMQcwAKxuC9wyEzW4RN-TTrqplEaziSw9yaoX5CQs3MONkCf2HaHh43GhlRdhEcxC1cy5VupzffcQ4_0FOm7uk/s1600/logo_blogger.jpeg"></a>
===================================================================Gambar dengan efek blur dengan link
Kode script
===================================================================
<a href="http://www.sazlina.co.cc/" class="linkopacity"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBwV9mQ4WKfVBP69hBPI0dd_5w6uh2HN-shawyWP0LwkDIJYTYeMvVxPMQcwAKxuC9wyEzW4RN-TTrqplEaziSw9yaoX5CQs3MONkCf2HaHh43GhlRdhEcxC1cy5VupzffcQ4_0FOm7uk/s1600/logo_blogger.jpeg"></a>
===================================================================Gambar dengan efek blur tanpa link
Kode script
===================================================================
<a href="#nogo" class="linkopacity"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBwV9mQ4WKfVBP69hBPI0dd_5w6uh2HN-shawyWP0LwkDIJYTYeMvVxPMQcwAKxuC9wyEzW4RN-TTrqplEaziSw9yaoX5CQs3MONkCf2HaHh43GhlRdhEcxC1cy5VupzffcQ4_0FOm7uk/s1600/logo_blogger.jpeg"></a>
===================================================================Selamat mencoba.
