Please HELP with hover on hover

[css]

Hello to you all!
I have a problem and I hope someone could help me. and I m sorry if there is allready same subject,I dont really have time to search anymore.
I checked on internet and thought I could find something but I didnt...
I would like to know if I can make hover on hover with links. I have to make a hover on link where bg color appears and a little cross before link name so when you go with mouse over that cross, a popup bubble appears...
I know how to make that background i did it with css with hover but now im confused I dont know how to make popup as well... can I do that also with css somehow or I need js? please if anybody knows,I would appreciate it very much!

 

[ancom]

Put that cross in separate <span> nested in link element and play with css to make hover for it... secondly, if this fails - google for js - there are many of them out there with many nice effects

 

[PixelPusher]

You could achieve this with css only but bare in mind, the "hover" state initiates a change only when the mouse in over that element. This makes perfect sense in the case of a links background changing color. But when you want another element on the page (modal popup) to appear based in a user hovering the mouse over an element in a link (the cross image), what happens when the mouse moves away from the cross image? Does the modal popup disappear? If not how do you close it? hide it? Will there be more than one of these on the page?

All in all, doing this through css alone, is possible, but I dont think it will be as fluid or user friendly. Using a simple bit of javascript would be the better path, imo.

 

[Edge]

I'd like to add that you shouldn't only change state on hover but also on focus so that keyboard only users get the same effect.