Question

我有一个图像库，以5X5矩阵显示图像。每个图像都有一个onmouseover函数，其中隐藏的div显示有关图像的一些细节，div使用onmouseout隐藏细节。包含图像细节的div可能包含可点击链接，因此我在光标位置下显示div。

我面临的问题是第5栏中的图像。如果包含详细信息的div具有更多内容，则会创建一个水平滚动条，并且细节会被切断。如何始终在光标下的视口内显示详细信息div？

没有多少，但这是代码

function eventRollOver(id) {

    var did = 'img_'+id;
    document.getElementById(did).style.display='';
}
function eventRollOut(id) {
    var did = 'img_'+id;
    document.getElementById(did).style.display='none';
}

非常感谢

Answer 1

尝试overflow:hidden

Answer 2

您需要对详细信息div position:absolute使用CSS绝对定位，并从事件对象（how-to）中提取鼠标位置，以便应用鼠标的x和y值到div的左侧和顶部CSS属性..

在视口中显示div

2 个答案: