0

我有一个像这样的 Jquery 弹出窗口

$("[id=messagelink]").hover(function(e) {
    $(this).next('#popupmessage').show();
}, function() {
    $(this).next('#popupmessage').hide();
});

div代码:

<div>......
<a href='' id='messagelink' name='messagelink' touserid='1' ><img src='images/icons/mail.png' width='15' height='15' /></a>
<div id='popupmessage' class='popup'>Blaaah</div>";
......
</div>

CSS

.popup {
display: none;
padding: 10px;
background: #eeeeee;
color: #000000;
border: 1px solid #1a1a1a;
font-size: 90%;
position: absolute;
}

在 FF、Chrome、Opera 中一切正常,但在 IE 中显示了弹出窗口,但它增加了父 DIV 的高度和宽度。更糟糕的是,它通过溢出来向 DIV 添加水平和垂直滚动条。呸!

我从 CSS 中删除了填充,然后问题就解决了。但我需要一个漂亮的弹出消息而不是裁剪消息。

可以做什么?

谢谢你的帮助。科埃诺斯

4

2 回答 2

0

如果您的目标不是 IE 7 或更低版本,则可以使用 div{box-sizing:border-box;}。您提供的任何填充都将填充到“内部”指定的 DIV 高度和宽度,而不是外部。

于 2013-03-26T17:34:15.160 回答
0

尝试使 div 位置相对。我自己从未经历过这种情况。

div {
    position: relative;
}

http://jsfiddle.net/HaJjH/2/

我检查了IE8的模拟器,你可以检查真正的IE8,看看它是否有效

于 2013-03-26T18:02:04.750 回答