Cara Membuat Gambar Di Postingan Hitam-Putih Dan Berwarna Saat Disentuh Kursor

Ya tuhan panjang banget judulnya, Pada artikel kali ini saya masih membahas tentang ilmu blog :) Cara Membuat Gambar Di Postingan Hitam-Putih Dan Berwarna Saat Disentuh Kursor, sebetulnya sudah banyak tutorial-tutorial demikian, namun sedikit berbeda dengan artikel saya kali ini, tutorial yang saya berikan hanya bersifat gambar di postingan yang menjadi hitam-putih dan berwarna sa'at disentuh kursor, jadi tidak untuk gambar keseluran termasuk gambar di home page masih normal :)

Cara sederhana ini memeang banyak diminati para blogger, karena dengan menggunakan Gambar Di Postingan Hitam-Putih Dan Berwarna Saat Disentuh Kursor maka blog kita akan telihat semakin elegan dan semakin menarik bagi pengunjung blog, contoh: perhatikan gambar dibawah ini :)

Cara Membuat Gambar Di Postingan Hitam-Putih Dan Berwarna Saat Disentuh Kursor Pertama buka Blogger -> Template -> Edit HTML dan cari ]]> </ b: skin> , setelah ketemu taruh kode dibawah ini tepat di atas kode ]]> </ b: skin>

.post-body img {

    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");

 /* Firefox 3.5+ */

    filter: gray;

 /* IE6-9 */

    -webkit-filter: grayscale(100%);

 /* Chrome 19+ & Safari 6+ */;

}

.post-body img:hover {

    filter: none;

    -webkit-filter: grayscale(0%);



}

Semoga tutorial sederhana Cara Membuat Gambar Di Postingan Hitam-Putih Dan Berwarna Saat Disentuh Kursor ini bermanfaat :)