Javascript 不透明度在IE8中不起作用

Javascript 不透明度在IE8中不起作用,javascript,jquery,css,opacity,ie8-browser-mode,Javascript,Jquery,Css,Opacity,Ie8 Browser Mode,我在这个网站上发现了很多类似的问题,但没有一个能解决我的问题。我在一个元素中动态添加了一个div,在这个div中我提到了不透明样式属性,如下所示 $('#cell').append('<div id="el_loading" style="-ms-filter:\"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\"; filter: alpha(opacity=50); opacity:0.5; background-color:

我在这个网站上发现了很多类似的问题,但没有一个能解决我的问题。我在一个元素中动态添加了一个div,在这个div中我提到了不透明样式属性,如下所示

$('#cell').append('<div id="el_loading" 
style="-ms-filter:\"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\";
filter: alpha(opacity=50);
opacity:0.5;
background-color: #fbfbfb;
height: 100%;
width:100%;
position:relative
;z-index:9999;">
<div style="top: 74.2px; width: 91px;">
<img  src="/myimage/loading.gif" title="Please Wait..." />
<span>
<b>Please wait ...</b>
</span>
</div>
</div>');
$('#单元格')。追加('
请稍候。。。
');

这样做是为了在向服务器发送ajax请求时模糊页面。这段代码是在javascript区域中编写的,因此我使用内联样式。上述样式在IE10中可以正常工作,但在IE8中不能正常工作。

在样式标记中为
过滤器使用单引号

 $('#cell').append("<div id='el_loading' 
 style='-ms-filter:\progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\; /* double quote will end your style here only. So use single quote. */
 filter: alpha(opacity=50);
 opacity:0.5;
 background-color: #fbfbfb;
 height: 100%;
 width:100%;
position:relative;z-index:9999;'>
<div style='top: 74.2px; width: 91px;'>
<img  src='/myimage/loading.gif' title='Please Wait...' />
<span>
<b>Please wait ...</b>
</span>
</div>
</div>");
$('#单元格')。追加(“
请稍候。。。
");

尝试添加以下内容

 -moz-opacity: 0.50;
    opacity:.50;
    filter: alpha(opacity=50);
因此,您的代码将成为

$('#cell').append('<div id="el_loading" 
style="-ms-filter:\"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\";
filter: alpha(opacity=50);
-moz-opacity: 0.50;
opacity:.50;
filter: alpha(opacity=50);
background-color: #fbfbfb;
height: 100%;
width:100%;
position:relative
;z-index:9999;">
<div style="top: 74.2px; width: 91px;">
<img  src="/myimage/loading.gif" title="Please Wait..." />
<span>
<b>Please wait ...</b>
</span>
</div>
</div>');
$('#单元格')。追加('
请稍候。。。
');

请将css脚本移动到您自己的css文件中

例如:

  • 创建一个名为style.css的文件,然后粘贴以下代码:
#el_装载{ /*IE 8*/ -ms过滤器:“progid:DXImageTransform.Microsoft.Alpha(不透明度=50)”; /*IE 5-7*/ 过滤器:α(不透明度=50); /*网景*/ -moz不透明度:0.5; /*Safari 1.x*/ -khtml不透明度:0.5; /*好浏览器*/ 不透明度:0.5; 背景色:#fbfb; 身高:100%; 宽度:100%; 职位:相对 z指数:9999; } 您的脚本如下所示:

$('#cell').append('<div id="el_loading">
    <img  src="/myimage/loading.gif" title="Please Wait..." />
    <span>
        <b>Please wait ...</b>
    </span>
    </div>
</div>');
$('#单元格')。追加('
请稍候。。。
');

希望有帮助。

尝试在一个单独的
css
文件中定义样式,附加干净的HTMLY你应该在这里询问它是否在IE8 lolIts上有效!相应地更改了我的代码,但结果相同。我正在IE10浏览器中以IE8浏览器模式进行测试,这会导致任何问题吗?我已经稍微更新了我的代码。现在试试看。还有一个问题,它在其他浏览器中工作吗?它在其他浏览器中工作,甚至在IE10中,进行了上述更改,但都是徒劳的。
$('#cell').append('<div id="el_loading">
    <img  src="/myimage/loading.gif" title="Please Wait..." />
    <span>
        <b>Please wait ...</b>
    </span>
    </div>
</div>');