Quick view button should appear on mouse over!

  • Resolved rish30990

    (@rish30990)


    8 years, 9 months ago

    Hi! I was trying to change the position of quick view from bottom to on the product image. I have done it by apply following CSS
    .woocommerce ul.products li.product .button {
    position: absolute;
    top: 30%
    left: 15%;
    }
    But only problem that left for me now is that I want button on image should appear on mouseover only. Can you suggest me any way for it. I have tried by setting opacity but didn’t work as i want. Thanks !

    https://www.ads-software.com/plugins/yith-woocommerce-quick-view/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter rish30990

    (@rish30990)

    Ok Figured it out!
    I used following css

    .products li .button {
    display: none;
    left: 24%;
    position: absolute;
    top: 24%;
    }
    .products li:hover img{opacity:0.5;}
    .products li:hover a.button{display:block;}

    Its working now!

    I tried using your code to fix my Quickview buttons but it didn’t work, and it changed my Add to Cart buttons too.

    I deleted the CSS and even deactivated the plugin, but my Add to Cart buttons still have a hazy background instead of transparent like they were before! Any suggestions to undo whatever the code did??

    You can see it on my site https://www.handwrittenforever.com

    Thanks!

    Nevermind! I figured it out ??

    Thread Starter rish30990

    (@rish30990)

    Hi stephdb88!
    Glad you figured it out. But can you share your solution For the Future Viewers. So that the post can become more helpful for others.

    Not every solution works for every theme, if mine don’t work for someone then your might be helpful.Thanks ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Quick view button should appear on mouse over!’ is closed to new replies.