I have element in code. When I mouse over it there shows button on image. I'm trying to find out what code is responsible for that mouse over action.
I tried to make Breaks in Chrome's Dev Tools - no result. I was looking for hover in CSS, no such attributes. I have no ideas what to do next, how to debug that code.
Talking in details, I'm talking about element "add to cart" showing when you hover image on this shop template: https://demo.themeisle.com/shop-isle/product-category/clothing/dresses/
Thanks for any suggestions, Lukasz
Have a look at the :hov option in the Chrome debugging tools under Elements > Styles. You can then trigger various element states (e.g: hover).
As explained in the following image, the .product:hover .product-button-wrap
style controls how the add button is displayed when the product is hovered over. .product:hover
sets the style for all elements with the CSS class product
when they are hovered over. .product:hover .product-button-wrap
sets the style of any elements with the class product-button-wrap
when they belong to an element with class product
that is hovered over.