防止工具提示/div在鼠标悬停时离开屏幕/离开浏览器chrome

Question

我正在使用jquery添加和删除一个类，当我将鼠标悬停在缩略图上时，会弹出一个信息丰富的工具提示，但是当缩略图太靠近浏览器chrome的边缘时，工具提示就会超出chrome而不可读。关于从哪里开始让工具提示保留在屏幕上，你有什么想法吗？谢谢你的建议。代码如下：

http://jsfiddle.net/ySeTL/

Answer 1

http://jsfiddle.net/loktar/ySeTL/10/

全屏 http://jsfiddle.net/loktar/ySeTL/10/embedded/result/

基本上，如果它是越界的，它就不会显示出来。下一步是使用else，它将元素定位在向左显示太多像素的位置。

我被你的标记搞糊涂了。看起来你把所有的东西都作为单独的元素展示了。IE标题，图片，描述都是独立的隐藏元素。我会用一个容器包住它们，然后隐藏/显示它，并放置它。

Answer 2

在过去，我使用位置计算算法来确定弹出窗口的位置，然后再显示它。您必须确定弹出节点的位置、宽度和高度，然后将其与文档尺寸进行比较。如果它落在边界之外，则在调用类更改函数之前重新定位它。