Question

此页面在IE9中使用悬停工具提示但在IE11企业模式下根本没有做任何事情，兼容性视图设置与IE8一样：

有人可以帮助解释为什么IE11会以不同的方式对待它吗？

＆＃13;

<!DOCTYPE html>
<html lang="en">


<head>

	<meta charset='UTF-8'>
	<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
	<meta http-equiv="Pragma" content="no-cache" />
	<meta http-equiv="Expires" content="0" /> 

	<title>Current Payroll Status</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>


	<style>

.hover {
    position:relative;
    left:1px;
}

.tooltip { /* hide and position tooltip */
  top:-10px;
  background-color:black;
  color:white;
  border-radius:5px;
  opacity:0;
  -webkit-transition: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -ms-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  transition: opacity 0.5s;
}

.hover:hover .tooltip { /* display tooltip on hover */
    opacity:1;
}
	</style>

</head>


<body>
<table cellspacing="0" cellpadding="0" width="40%">

	<TR>

		<TD rowspan="1" colspan="1" valign="top" width="33%"><center>

			<div class="hover">Payroll Calculation<div class="tooltip"></center>

				<table cellspacing="0" cellpadding="4" width="100%">

					<TR><TD>Avg Runtime:</TD><TD>49.89m</TD></TR>

				</table>

			</div></div>

		</TD>
	</TR>

</table>

</body>

＆＃13;

Answer 1

从html代码中删除迷路<center> </center>：

<table cellspacing="0" cellpadding="0" width="40%">

    <TR>

        <TD rowspan="1" colspan="1" valign="top" width="33%">

            <div class="hover">Payroll Calculation<div class="tooltip">

                <table cellspacing="0" cellpadding="4" width="100%">

                    <TR><TD>Avg Runtime:</TD><TD>49.89m</TD></TR>

                </table>

            </div></div>

        </TD>
    </TR>

</table>

http://codepen.io/anon/pen/aNovLr

工具提示悬停在IE11中无效

1 个答案: