我展示了一个div的工具提示onmouseover。工具提示可以在火狐和IE8中正确显示。但在IE-7中,它位于div之后。HTMl标记
<table cellspacing="0" cellpadding="5" border="0" id="tblEmployee">
<tbody>
<tr>
<td>
<div class="dvBorder" empid="1" nomineeid="21">
<img style="padding: 5px;" src="../../Images/user.jpg" alt="user">
<span class="EmpolyeeName">First Last</span><span class="EmployeeEmail">mail@amdocs.com</span></div></td>
</tr>
</table>当用户将鼠标悬停在div.dvBorder上时,工具提示是在jquery函数的帮助下动态创建的。
function RollOut(result,crntDiv) {
$(crntDiv).children('img').before(CreateElems('div', 'RollOverTip', result));
}
function CreateElems(type,cssClass,value)
{
var elem = $(document.createElement(type));
if(value != null)
elem.text(value);
if(cssClass!= null)
elem.addClass(cssClass);
return elem;
}css类。
.RollOverTip
{
background-image: url("/Images/screen2-rollover-tooltip.png");
background-repeat: no-repeat;
color: #000000;
font-family: Calibri Regular;
font-size: 18pt;
height: 199px;
line-height: 20pt;
margin-left: 385px;
position: absolute;
width: 474px;
z-index: 90000;
padding:34px;
}
.dvBorder
{
background-image: url(/Images/screen2-button.png);
background-repeat: no-repeat;
height: 125px;
width: 400px;
cursor:pointer;
position: relative;
}这是css的问题吗,因为它在IE-8,FF中工作。
发布于 2013-02-20 16:34:38
尝试将z索引添加到您的.dvBorder类中:
.dvBorder
{
background-image: url(/Images/screen2-button.png);
background-repeat: no-repeat;
height: 125px;
width: 400px;
cursor:pointer;
position: relative;
z-index:0; /* If this doesn't work, try -1 */
}https://stackoverflow.com/questions/14974103
复制相似问题