[英]Tooltip hover not working in IE11
此頁面在IE9中使用了懸停工具提示,但在IE11企業模式下完全不執行任何操作,並且兼容性視圖設置可以像IE8一樣工作:
有人可以幫助解釋為什么IE11對待它的方式有所不同嗎?
<!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>
從您的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>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.