Fix my tooltip closing problem

[kenw232]

I have a pure CSS tooltip that works well. I just can't figure out how to manually close it with jQuery. I can hide it but it disappears and won't come back.

jQuery Simple Example - JSFiddle
Mouse over the tooltip and click "close".

Anyone know if this can be closed via a link? I've tried all sorts of jquery trigger("mouseout") type events but nothing works.

 

[Snowknight26]

You can't have a pure CSS solution for that since JavaScript can't manage CSS pseudo-selectors.

What you can do instead is to use $('.wrapper').hover() that adds/removes a CSS 'hover' class, then when you click close, remove the 'hover' class you just added.