propiedad overflow , despliegue de elementos internos

tengo realizado un código que despliega tablas de información , esta información a su vez esta contenida en un td con un div con overflow, el problema es q dentro de mi tabla tengo otro div que se despliega al "clikear" un boton , y quiero que esta salga sobre el div no dentro ... como una imagen vale mas que mil palabras adjunto una imagen de como se ve , y como quisiera que se vea ... obviamente sin quitar el scroll .
Asi se Ve Ahora
http://l4c.me/fotos/andreadelgado2711/lo-que-pasa

[img]http://l4c.me/fotos/andreadelgado2711/lo-que-pasa[/img]

solo quiero que el otro div salga por encima sin perder el scroll

http://l4c.me/fotos/andreadelgado2711/lo-que-quiero-q-pase

[img]http://l4c.me/fotos/andreadelgado2711/lo-que-quiero-q-pase[/img]

espero alguna ayuda....

Sería bueno echarle un vistazo al código, pero por experiencia, debe ser algún position en alguna etiqueta parent, en este ejemplo http://codepen.io/anon/pen/GmDlh si descomentas el position de .contenedor, ocurre algo similar a lo que te pasa.
En este ejemplo no use Javascript, la ventana flotante se muestra al hacer hover en el botón.

Yo soy muy nuevo en esto, pero creo que lo que le tienes quedar es una propiedad position:relative para sacarla principalmente fuera del flujo normal del html y luego posicionarla según los valores que necesites.