I have a div that scales to 0.9 and opacity 80% in 500ms when you hover over it. When you click that div, it scales back up to 1 and 100% opacity in 500ms. The issue is, when the mouse leaves the div then re-enters, the hover interaction can occur again but I want it to be disabled once you click on it.
Anyone know how to do this?
It’s not possible to deactivate a :hover interaction with another trigger. The effect you’re looking to achieve may be possible anyway, but with a trick. For example with two elements one on top of the other… the one on top would get the hover and the click, the click would make it disappear and affect the one under it. Once disappeared (display:none) the hover would not happen again.
The problem with that is the div on top doesn’t scale / opacity the div underneath it.
Make two exact copies of the element… one will get the hover, the other the 100% opa
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.