弹出窗口部分显示在浏览器窗口之外

Question

我正在使用 CSS 在我的页面上创建一个弹出窗口。我的标签内有一个设置为 display:none; 的内容。然后，当您将鼠标悬停在标签上时，会弹出该单词的定义。这对我来说效果很好，但是有时弹出窗口出现在浏览器窗口之外。有没有办法使用 CSS 确保整个弹出窗口保留在浏览器窗口内，或者我需要添加一些 Javascript？我真的希望弹出窗口出现在链接的位置，但我不在乎它是否向左或向右移动以便位于窗口内并可见。

这是我的代码：

a span {
display: none;
}

a:hover span {
display: block;
position: absolute;
width: 300px;
z-index: 1000;
}

预先感谢您的帮助！:-)

Answer 1

您可以使用 jQuery 检查弹出窗口的角是否在窗口内。看看这个：如何检查元素是否在屏幕外