Question

我做了一些关于让fadeTo函数在IE8中工作的研究，其中div的CSS位置设置为relative。我找到了很多答案，说通过添加filter:inherit和opacity:inherit有一种解决方法我尝试使用它，它在IE8中不起作用，在Chrome和FF中运行良好。我已经提交了测试代码段（只需更改指向jQuery库位置的链接），只需复制并粘贴整个内容并测试即可。基本上我试图淡化HTML body标签中的所有内容，而不仅仅是特定元素。

谢谢大家

<html>
<head>
<script src="jQuery/jquery-1.7.2.js"></script>

<style type="text/css">
#div_item_added{
  display: block;
  margin: 9px;
  padding: 5px 5px 5px 5px;
  border-style: solid;
  border-width: 2px;
  border-color: #9B9A9A;
  height: 80px;
  width: 400px;
  background: #FFFFFF;
overflow: hidden;
}

#div-test{
  position: relative;
  filter: inherit;
  opacity: inherit;
  top: 200px;
  left: 200px;
}
</style>

<script type="text/javascript" >
function fade(){
  $("#div-body").fadeTo(1000, 0.1);
}
function unfade(){
  $("#div-body").fadeTo(1000, 1);
}
</script>
</head>

<div id="div-body">
<body>
<div id="div-test">
  <table border="1" style="background-color:#FF0000;">
  <tr>
  <td>A table that should Fade when html body fades</td>
  </tr>
  </table>
</div>
</body>
</div>

<div id="div_item_added">
<table border="0" style="border:border-collapse;">
<tr>
<td>Some text</td>
</tr>
<tr>
<td>
<input type="button" value="Fade Background" onclick="fade();">
<input type="button" value="Un-Fade Background" onclick="unfade();">
</td>
</tr>
</table>
</div>
</html>

在IE8中jQuery fadeTo

0 个答案: