onmouseover显示div调整x和y

Question

我的页面中有几个小图像，然后我在图像旁边显示一个div。到现在为止还挺好。但是，当图像位于页面底部时，我想将图像显示在图像下方而不是图像上方。基本上我要做的是验证图像的位置，如果在底部附近，我会在图像上方显示div。如果图像靠近右边距以显示左边的div，则相同。

有谁知道实现这一目标的任何简单方法？

干杯

Answer 1

在没有看到任何代码的情况下，建议采用“正确”的方式有点困难，但我会尝试以下方法（使用JQuery语法）：

首先，计算您的“阈值” - 无论您希望div出现在下方的最低点。可能最简单的方法是使用$(document).height()并减去X像素。

然后，在悬停时，计算图像在页面上的位置。您可以使用.offset();。

执行此操作

如果图片顶部高于阈值，请在下方显示div，否则请在上方显示div。

注意：根据页面的设置方式，您可以计算每个页面的加载位置，然后将类应用于低于阈值的类，并使用它来正确定位相应的div。 / p>