Title: Limit mouse hover effect
Last modified: September 9, 2021

---

# Limit mouse hover effect

 *  [dddprinters](https://wordpress.org/support/users/dddprinters/)
 * (@dddprinters)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/)
 * HI, using woocommerce and oceanWP theme, I am wanting the mouse hover effect 
   on the archive pages only please. So NOT to take place on the site logo or single
   product pages. I am currently using this code
 *     ```
       .product.type-product:hover img {
           opacity :0.4;
           z-index: -1; 
       	-webkit-transition: all 2s ease;
       -moz-transition: all 2s ease;
       -ms-transition: all 2s ease;
       -o-transition: all 2s ease;
       transition: all 2s ease;
       }
       ```
   
    -  This topic was modified 4 years, 7 months ago by [dddprinters](https://wordpress.org/support/users/dddprinters/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Flimit-mouse-hover-effect%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 6 replies - 1 through 6 (of 6 total)

 *  [Abhishek](https://wordpress.org/support/users/abhikr781/)
 * (@abhikr781)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14854362)
 * Hello,
 * Sorry but not getting you to want exactly what you are looking for.
    If you want
   to remove the logo hover effect, following the doc will help you. [https://docs.oceanwp.org/article/541-remove-logo-hover-effect](https://docs.oceanwp.org/article/541-remove-logo-hover-effect)
 *  Thread Starter [dddprinters](https://wordpress.org/support/users/dddprinters/)
 * (@dddprinters)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14864120)
 * I would like the hover effect NOT to occur on the single product pages. With 
   the above CSS I have put in, the hover effect is happening everywhere. I guess
   I need to change the class from product.type-product to something else to narrow
   down where it is applied?
 *  [Abhishek](https://wordpress.org/support/users/abhikr781/)
 * (@abhikr781)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14865753)
 * For the single product page, you need to add the single product class.
 * Try this one.
 *     ```
       .single-product .product.type-product:hover img {
           opacity :0.4;
           z-index: -1; 
       	-webkit-transition: all 2s ease;
       -moz-transition: all 2s ease;
       -ms-transition: all 2s ease;
       -o-transition: all 2s ease;
       transition: all 2s ease;
       }
       ```
   
 *  Thread Starter [dddprinters](https://wordpress.org/support/users/dddprinters/)
 * (@dddprinters)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14868298)
 * ahh yeah that makes it happen on the single product pages right? I am wanting
   it NOT to happen there. What is the product class for archive pages only?
 *  Thread Starter [dddprinters](https://wordpress.org/support/users/dddprinters/)
 * (@dddprinters)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14868494)
 * Found what I wanted thanks. The answer is
    .woocommerce ul.products .product
 *  [Abhishek](https://wordpress.org/support/users/abhikr781/)
 * (@abhikr781)
 * [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14869563)
 * Glad to hear that you found the solution to the issue.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Limit mouse hover effect’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/oceanwp/4.1.5/screenshot.png)
 * OceanWP
 * [Support Threads](https://wordpress.org/support/theme/oceanwp/)
 * [Active Topics](https://wordpress.org/support/theme/oceanwp/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/oceanwp/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/oceanwp/reviews/)

## Tags

 * [mouse-hover](https://wordpress.org/support/topic-tag/mouse-hover/)

 * 6 replies
 * 2 participants
 * Last reply from: [Abhishek](https://wordpress.org/support/users/abhikr781/)
 * Last activity: [4 years, 7 months ago](https://wordpress.org/support/topic/limit-mouse-hover-effect/#post-14869563)
 * Status: not resolved