Change tooltip direction when it's out of view

Question

I'm trying to change my website's tooltip direction when it's out of the page's viewport, but all I was able to do is to wrap the lines so it doesn't get out of the viewport.

JSFiddle: http://jsfiddle.net/x3cjpL14/3/

ADD: I'm using Bootstrap 3 by the way..

Answer 1

Sorry, I just disabled line wrapping on the tooltip by using the white-space in the css file and then checked if the tooltip isn't visible by the jQuery $("#element").visible() and changed positions with css from the JS file :)