Auto position tooltip when exceed on browser's width

Question

What I want to happen is when the tooltip width exceeds to browser's viewable area, it will automatically re-position itself, so the content can be viewed fully. The tooltip should not overlap on referenced div. The tooltip should not resize width or height when re-positioning itself. Please help.

Here is my sample Code

Answer 1

Are you trying to do this?

See Demo: http://jsfiddle.net/rathoreahsan/mpDXY/

Reference Website: http://www.javascriptkit.com/script/script2/htmltooltip.shtml