Searching...
Wednesday 13 November 2013

Cara Buat Gambar Tersamar Di Seluruh Postingan

21:36
Malam semua para pengunjung, maaf nih baru nge posting lagi
kali ini saya ingin memberikan cara membuat sebuah efek yang membuat gambar pada blog menjadi transparan ketika tidak tersentuh kursor dan menjadi terlihat jelas ketika tersentuh kursor atau sebaliknya. Efek ini akan bekerja pada seluruh file gambar yang ada di setiap bagian blog, jadi seluruh gambar akan secara
otomatis mendapatkan efek ini, dengan dukungan jquery, sehingga efek ini akan terlihat lebih
menarik, sebagai contoh blog ini, coba sorot gambar di bawah ini maka akan menjadi terang ketika di
sorot.
Contoh gambar nya seperti ini, Transparan bukan?

kalau pengen seperti itu, Berikut untuk membuat langkah-langkahnya berikut :
  • Log In ke Blogger.
  • Pilih Template → Edit HTML → Cecklist Expand Template Widget.
  • Cari kode </head>, dan masukan script dibawah ini di atas </head> :
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'/>
<script type='text/javascript'>
$(document).ready(function() {
$(&#39;img&#39;).fadeTo(&#39;medium&#39;, 0.5);
$(&#39;img&#39;).hover(function() {
$(this).fadeTo(&#39;medium&#39;, 1.0);
}, function() {
$(this).fadeTo(&#39;medium&#39;, 0.5);
});
});
</script>

Jika dalam template, telah terdapat file jquery 1.5.2 (teks warna merah), maka script warna
merah tidak perlu di pasang kembali.
Pengaturan :
Teks warna hijau, merupakan tingkat transparansi gambar sebelum dan setelah tersentuh
kursor.
Teks warna biru, merupakan tingkat transparansi gambar saat tersentuh kursor.
Simpan dan lihat hasilnya.

Semoga trik ini memperindah blog kalian.

0 comments:

Post a Comment