悬停时完全弹出显示答案

【问题标题】：Full popup display on hover悬停时完全弹出显示
【发布时间】：2014-05-15 16:34:01
【问题描述】：

我制作了一个弹出 div，它会在悬停在另一张图片上时显示。弹出 div 使用 like 显示

div.image-normal{//image is in this div
height:315px;
}
img:hover div.popup{
  display:block;
  position:absolute;
  top:-315px;
  height:328px;
}

我在 3 行中有 12 张图片。当我滚动时，有时 div.popup 会从顶部浏览器区域中截断。我希望当弹出窗口显示并切断时它会自动滚动并适合浏览器窗口。任何想法？

【问题讨论】：

标签： jquery css popup hover

【解决方案1】：

更改弹出窗口的位置。这会将其置于屏幕中间。

img:hover div.popup {
    display:block;
    position:absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    height:328px;
}

DEMO HERE

【讨论】：

谢谢，但我在 3 行中有 12 张图片。每个图像都有弹出窗口。当浏览器弹出窗口中的滚动页面被切断时。
@user3639684 你使用absolute定位。你能指望什么？您必须创建一个 JSFiddle 并向我们展示您的意思，因为我没有得到您想要的。

【解决方案2】：

如果我理解正确，您希望您的框一直显示，即使在滚动时也是如此？

如果是这样，您需要使用position: fixed。

我在图像上创建了一个简单的小悬停效果，您可以将悬停在不同的图像上，然后查看显示的图像编号。

这应该适用于您要完成的工作

http://jsfiddle.net/TMjeb/2/

【讨论】：