使用灰层覆盖UI时,有事发生
在用户提交时,动态创建一个Div (background-color:#000000)然后动态改变灰度。实现渐变的效果:
IncreaseGray: function(){
if(this.currentOpacity>25)
{
this.innerDiv.style.filter ="alpha(opacity=25)";
clearTimeout(this.timer);
}
else
{
this.currentOpacity+=2;
this.innerDiv.style.filter ="alpha(opacity="+this.currentOpacity+")";
this.timer=setTimeout(this.IncreaseGray.bind(this),10);
}
这段代码在IE 7.0中,运行正常,但在IE 6.0中,存在一个问题:在动态改变灰度的时候,层下的UI莫名地被切成了一半,另一半消失了。if(this.currentOpacity>25)
{
this.innerDiv.style.filter ="alpha(opacity=25)";
clearTimeout(this.timer);
}
else
{
this.currentOpacity+=2;
this.innerDiv.style.filter ="alpha(opacity="+this.currentOpacity+")";
this.timer=setTimeout(this.IncreaseGray.bind(this),10);
}
解决方法:
//get div element of UI contents
var contentDiv=document.getElementById("div_content");
contentDiv.style.visibility="hidden";
contentDiv.style.visibility="visible";
var gd=new GrayDiv();
gd.Create();
gd.Show();
IE 6.0、7.0均测试通过。
var contentDiv=document.getElementById("div_content");
contentDiv.style.visibility="hidden";
contentDiv.style.visibility="visible";
var gd=new GrayDiv();
gd.Create();
gd.Show();