Entri Terbaik



Created by Diaz

Rabu, 05 Juni 2013

Cara Buat Gambar Tersamar Di Seluruh Postingan

Kalau kemaren saya telah memposting Cara Membuat Efek Gambar Transparan Di Blog kali ini saya akan posting cara membuat efek gambar tersamar/Transparan di seluruh postingan   , memang banyak sekali trik dan tips blog yang berguna untuk menarik para pengunjung blog agar berlama2 di blog itu, salah satunya adalah cara membuat efek gambar tersamar di seluruh postingan  .


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.
Untuk membuatnya ikuti langkah-langkah 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