CODEWITHSUNDEEP
htmlcsshover
Austin Lovell
Austin Lovell

Reputation: 1049

Hover class not working on a div

I am unable to get the hover class to work on any element within my html document. We are trying to make anyone of the 4 squares to disappear, aka display:none; Here is a demo of my site. Let me know if you can spot what my error is. Thank you in advance!

https://c9.io/riotgear66/day1/workspace/sams/html/index.html

Upvotes: 0

Views: 94

Answers (2)

alexsh
alexsh

Reputation: 1141

If you set display:none on an element over which you are hovering, you then cannot hover over a nonexistent element. This is what causes the flickering. To do what you would like to do you have to explicitly change the background in the .css for the element.

Upvotes: 0

James Montagne
James Montagne

Reputation: 78750

The problem with trying to hide something when it is hovered is that as soon as it is hidden, it is no longer hovered over and it comes back. So you can't do that.

You could use opacity: 0 instead:

http://jsfiddle.net/bYNmh/

Upvotes: 3

Related Questions