Home » Ask (Forum) » Cara Membuat Image Thumbnail di WordPress Menjadi Buram?

Question

Hi, saya ingin membuat image thumbnail jika di sorot mouse atau mouse hover akan berubah menjadi buram, gimana ya om itu cara nya ?

thanks

Aug 18, 2016 (4 months ago) - Posted by 1 Comment

One Answer

  1. Jihan says:

    Hi,

    Caranya cukup simple, hanya edit css. Langkah-langkahnya adalah cari terlebih dahulu class dari image tersebut, kalo di blog saya class image thumbnail adalah .featured-thumbnail img

    Setelah ketemu tambahkan class baru di style.css template anda dengan menambahkan hover dibelakang nya letakkan dibawahnya. lihat contoh dibawah ini.

    /*---Default : ----*/
    .featured-thumbnail img {
        margin-bottom: 0;
        width: 100%;
    }
     
    /*-------Diberi hover:--*/
     
    .featured-thumbnail img:hover  {
        transition: all 2s ease;
        opacity:0.5;
        filter:alpha(opacity=50); /* For IE8 and earlier */
        -webkit-transition: all 2s ease;
        -moz-transition: all 2s ease;
        -ms-transition: all 2s ease;
        -o-transition: all 2s ease;
        transition: all 2s ease;
        background: transparent;
    }
    Register Member

Your Answer

Your email address will not be published. Required fields are marked *