Absolute position element not hidden outside of scrollbox

Question

I have some scenarios where I need to have a scrollbar, and I need to have a box popup for multiple purposes, in the example It's just for a name over a photo element. Is there anyway I can do this?

Photo example: http://img36.imageshack.us/img36/4696/problemtn.png

As is is how it should work, however I need to have overflow auto as well.. (so uncomment it, then you see my problem):

http://jsfiddle.net/kGAPG/

Answer 1

set your popup div at absolute postion and and its parent at relative postion set z-index:1000; to the parent container of the parent of popup and set z-ndex:1001; to parent of popup and the set z-index:1002; to popup. and please next time put your code on the board or at http://jsfiddle.net/

Answer 2

this depends on how you have your elements layed out. If you are trying to have the tooltips window pop up over the browser's scrollbars, then no, you can't do that (afaik).

If you have a div with scrollbars and that div is contained in the middle of the screen, yes you can do that.

What you will need to do is create a div at the top level of the document and have its position set to "absolute". Then, with jquery, get the position of the picture element you want the box to pop up next to and set the top-level div's top and left style attributes accordingly (remembering to add some for the offset)

Let me know if that is what you are trying to do!