CSS の位置が に設定されているfadeTo
IE8 で関数を機能させることに関して、いくつかの調査を行いました。追加することで回避策があるという多くの回答が見つかりました。これを使用し
てみましたが、IE8 では機能せず、Chrome と FF では正常に機能します。テスト スニペット コードを送信しました (jQuery ライブラリの場所へのリンクを変更するだけです)。全体をコピーして貼り付け、最後にテストしてください。基本的に、特定の要素だけでなく、HTML body タグ内のすべてのコンテンツをフェードしようとしています。div
relative
filter:inherit
opacity:inherit
ありがとう
<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>