I’m using jquery to add and remove a class to have an informative tooltip pop up when I hover over a thumbnail but when the thumbnail is too close to the edge of the browser chrome the tooltip goes outside the chrome and isn’t readable. Any ideas on where to start to have the tooltip remain on screen? Thanks for any suggestions. Here is the code:
Share
http://jsfiddle.net/loktar/ySeTL/10/
full screen
http://jsfiddle.net/loktar/ySeTL/10/embedded/result/
Basically that just doesn’t show it if it will be out of bounds. The next step would be to have an else, that positions the element you are displaying so many pixels to the left.
Im confused by your markup a bit. Looks like you have all the things your showing as individual elements. IE title, pic, description are all separate hidden elements. I would wrap a container around all of them, then hide/show that, and position that.