aph aph - 1 year ago 154
CSS Question

How to make a div disappear on hover without it flickering when the mouse moves?

I've seen answers suggesting just

on the
css. But that makes the div flicker when the mouse is moving.

EDIT: Added jsfiddle

Answer Source

display:none will take the element out of the render tree, so it loses :hover state immediately, then reappears and gets :hover again, disappears, reappears, etc...

What you need is:

#elem { opacity:0; filter:alpha(opacity=0); }

It will leave the place empty, so no flickering will appear. (Demo or yours updated)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download