Close

How to remove Hover effect to Sub Categories

michele.tucci
9 years ago
#8957 Quote
Avatar
  • 2
Hi, I created a copy of CategoryTemplate.ProductsInGridOrLines, for my sub categories I want remove hover effect.

Can you Help me ?
Peter.Zhekov
8 years ago
#8978 Quote
Avatar
  • Moderator
  • 104
Hi there,

Notice that there are two different hover effects you can switch between from admin setting: 'Item box hover effect:'.
To disable both effects you must make this styles changes (actually comment the code below will be enough).
For the first hover effect find the code below and comment it:

.product-grid .item-box:hover .details {
    background: none repeat scroll 0 0 #ffffff;
    bottom: 0;
    color: #000000;
}


For the next lines of code just add the bold text like is shown:
.product-grid .item-box:hover .details .buttons {
    bottom: -47px;
    display: none;
}



For the second hover effect find and comment the code below:
.product-grid .item-box:hover .details .buttons {
    bottom: -47px;
    display: none;
}.product-grid .item-box:hover .hover-effect-2 .picture a::after {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2);
}
.
Then again find this below and add the bold style:
.product-grid .item-box:hover .hover-effect-2 .buttons {
    display: none;
    opacity: 1;
}


If you do not know where to find those styles, look here: '~Themes/Tiffany/Content/CSS/980.css'.

Finally look the example below to see how you must comment the code:

/*.product-grid .item-box:hover .hover-effect-2 .picture a::after {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2);
}*/
Regards,
Peter Zhekov
Nop-Templates.com