求一个让层逐渐透明的JS

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META content="MSHTML 6.00.3790.2706" name=GENERATOR></HEAD>
<BODY>
<SCRIPT>
var strdo ="";
var ishide = true;
function showdiv(){
if(!ishide)return;
var obj = document.all.ly;
obj.style.display="block";
obj.style.width=document.body.clientWidth;
obj.style.height=document.body.clientHeight;
//mydiv.innerText=obj.filters.alpha.opacity
if(obj.filters.alpha.opacity>=100){
clearTimeout(timer1);
obj.filters.alpha.opacity=100;
ishide=false;
return;
    }else{
obj.filters.alpha.opacity+=5;
timer1=setTimeout("showdiv()",1)
return;
}
}
i=0
function hidediv(){
if(ishide)return;
var obj = document.all.ly;
timer1=null;
i++
if(obj.filters.alpha.opacity<=5){
 obj.style.display="none";
 timer1=null;
 ishide = true;
 return;
}
obj.filters.alpha.opacity=obj.filters.alpha.opacity -4;
if(obj.filters.alpha.opacity<=0)obj.filters.alpha.opacity=0
//alert(a)
// mydiv.innerText=i+":"+obj.filters.alpha.opacity+":"+(obj.filters.alpha.opacity<=5)
timer1=setTimeout("hidediv()",10)
}function f_add()
{  hidediv();
 
}
    </SCRIPT>
 
<DIV id=mydiv></DIV><INPUT onclick=showdiv() type=button value=显示> 
<DIV id=ly 
style="DISPLAY: block; Z-INDEX: 9999; FILTER: alpha(opacity=1); LEFT: 0px; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #ccc">
<DIV id=ly2 
style="Z-INDEX: 99999; ; LEFT: expression((document.body.offsetWidth-document.all.tb_msg.offsetWidth)/2); ; WIDTH: expression(document.all.tb_msg.clientWidth); POSITION: absolute; ; TOP: expression((document.body.offsetHeight-document.all.tb_msg.offsetHeight)/2); ; HEIGHT: expression(document.all.tb_msg.clientHeight-80); BACKGROUND-COLOR: #fff" 
align=center>
<TABLE id=tb_msg 
style="BORDER-RIGHT: #e7e3e7 1px solid; BORDER-TOP: #e7e3e7 1px solid; BORDER-LEFT: #e7e3e7 1px solid; BORDER-BOTTOM: #e7e3e7 1px solid; BORDER-COLLAPSE: collapse" 
cellSpacing=0 cellPadding=0 width=340 border=1>
  <TBODY>
  <TR>
    <TD 
    style="PADDING-LEFT: 4px; FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #fff; PADDING-TOP: 2px; BACKGROUND-COLOR: #73a2d6" 
    height=27>[数据保存]</TD></TR>
  <TR 
  style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; PADDING-TOP: 4px; HEIGHT: 50px">
    <TD align=middle>保存成功</TD></TR>
  <TR>
    <TD style="BACKGROUND-COLOR: #f7f7f7" align=middle height=30><INPUT onclick=f_add() type=button value=新增>&nbsp;&nbsp;&nbsp;<INPUT onclick="hidediv('modify')" type=button value=编辑记录>&nbsp;&nbsp;&nbsp;<INPUT onclick="hidediv('exit')" type=button value=退出></TD></TR></TBODY></TABLE></DIV></DIV></BODY></HTML>

解决方案 »

  1.   

    我测试了，IE可以，但是FIREFOX不管用
    FF用的是“-moz-opacity”属性来透明，但是用JS该这个属性总是不成功
      

  2.   

    ff没有透明这一说。
    filter仅仅ie支持。
      

  3.   

    FF可以通过-moz-opacity实现透明的
      

  4.   

    <img alt="图片.jpg" src="archives/images/powerbookg4.jpg" width="250" height="60" style="-moz-opacity:0.5; filter:alpha(opacity=50);cursor:hand;" onmouseover="this.style.MozOpacity=1;
    this.filters.alpha.opacity=100" onmouseout="this.style.MozOpacity=0.5;
    this.filters.alpha.opacity=50">
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script src="prototype.js"></script>
    <script>Element.setOpacity = function(element, value){  
      element= $(element);  
      if (value == 1){
        Element.setStyle(element, { opacity: 
          (/Gecko/.test(navigator.userAgent) && !/Konqueror|Safari|KHTML/.test(navigator.userAgent)) ? 
          0.999999 : null });
        if(/MSIE/.test(navigator.userAgent))  
          Element.setStyle(element, {filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'')});  
      } else {  
        if(value < 0.00001) value = 0;  
        Element.setStyle(element, {opacity: value});
        if(/MSIE/.test(navigator.userAgent))  
         Element.setStyle(element, 
           { filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'') +
                     'alpha(opacity='+value*100+')' });  
      }   
    } 
    function closeWin(id)
    {
    var obj = $(id);
    if(!obj) return false;
    var tFilter = 100;
    var tHandle = function(){
    if(tFilter <= 0){
    clearTimeout(tCloseWin);
    Element.remove(obj);
    return;
    }
    Element.setOpacity(obj,tFilter/100);
    tFilter -= 5;
    }
    var tCloseWin = window.setInterval(tHandle,100);

    }
    </script>
    <body>
    <div id="mydiv" style="width:100%; height:300px; background:#996699; position:absolute">
    ddddd
    </div>
    <script>closeWin('mydiv')</script>
    </body>
    </html>
      

  6.   

    上面是使用了prototype.js这个框架的
      

  7.   

    参考一下这个，支持IE,Firefox：
    <html>
    <head>
    <style>
    *{margin:0; padding:0;}
    body{height:100%;}
    .dis{width:100%;background:#333;position:absolute;left:0;right:0;top:0;bottom:0;-moz-opacity:0.5;filter:alpha(opacity=50);z-index:99;height:100%;text-align:center;}
    .dis2{width:100%;background:#333;position:absolute;left:0;right:0;top:0;bottom:0;-moz-opacity:0.5;filter:alpha(opacity=50);z-index:90;height:100%;text-align:center;}
    </style>
    </head>
    <body>
    <select id=sl>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    </select>
    <br>
    dsdddddddddddddddd
    <br>
    <input type=button value="change" onclick="test()" ID="Button1" NAME="Button1">
    </body>
    </html><script>
    function test()
    {
     var iframe = document.createElement("IFRAME");
     iframe.className = "dis2";
     iframe.id = "maskifr";
     var div = document.createElement("DIV");
     div.id = "mask";
     div.className = "dis";
     div.innerHTML = "<input type=\"button\" value=\"关闭\" onclick=\"document.getElementsByTagName('body')[0].removeChild(document.getElementById('maskifr'));document.getElementsByTagName('body')[0].removeChild(document.getElementById('mask'));\" />";
     document.getElementsByTagName("body")[0].appendChild(iframe);
     document.getElementsByTagName("body")[0].appendChild(div);
    }
    </script>
      

  8.   

    建议楼主这类问题可以交给Flash去解决--它专业，呵！~
      

  9.   

    谢谢各位，问题已解决！
    myvicy(热心肠的人) 的方法WORKS！