What im trying to do is have an absolute div show above some text when the text is hovered over.

Currently, I have the div showing on hover but it's positioning its self under the text and not over it like i'd like.

Also i would like to have the divs center point to be aligned / move with the cursor's X coord when it hovers over the text from left to right.

I'm not sure if the positioning of the div relative to the mouse cursor's X coord is something that can be done with pure CSS or if javascript / jquery needs to be used.

This is what I have so far: http://jsfiddle.net/t5r5LL50/

Can you use z scores for this?

You mean z-index?

Im not that familiar with CSS / web development languages but afaik z-index is for layering or stacking. Could be wrong though.

to stack the text on hover you could use the following:



to achieve a tooltip that follows the cursor, it would require js.

edit#2: moving one with js: http://jsfiddle.net/egr83n3a/

edit: on a side note, jquery is a library made with js and the desired effect could be achieved with some simple js and not the bulk of the entire jquery library.

also, you're correct z-index is simply the z positioning of elements on a page.

This post was edited by Markro on Aug 23 2014 11:45pm

awesome, that did the trick. thanks