一个关于多个层控制的问题

<html>
<head>
<title>First Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--定义CSS样式
#iewrap2{
position:absolute
}.masklayer{
filter:revealTrans(Duration=2,Transition=12) //定义过渡效果
visibility:hidden //将菜单层预置为不可见
}
-->
</style>
<script language="JavaScript">
<!--
function visibled(obj)
  {
obj.filters.revealTrans.apply(); 
obj.style.visibility="visible" ;
obj.filters.revealTrans.play();
  }function hiddened(obj)
  {
obj.filters.revealTrans.apply(); 
obj.style.visibility="hidden" ;
obj.filters.revealTrans.play();
  }
//var i=1;
function kk()
  {
   for(var i=1;i<=4;i++)
   {
lay=eval("Layer"+i);
if(lay.style.visibility=="hidden")
visibled(lay);
else
hiddened(lay);
   }
   setTimeout("kk()",2000);
}  
// -->
</script>
</head><body bgcolor="#FFFFFF" text="#000000" onload="kk();">
<div id="Layer1" class="masklayer" style="position:absolute; left:400pt; top:60pt; width:150pt;background-color:#00ffff; height:150pt; z-index:1; visibility: visible;"> 
      <p>&nbsp;</p>
    
  <p align="justify"><a href="#">1</a></p>
</div>
<div id="Layer2" class="masklayer" style="position:absolute; left:550pt; top:210pt; width:150pt; height:150pt; z-index:2; visibility: visible; background-color: #00FF00; layer-background-color: #00FF00; border: 1px none #000000;"> 
  <a href="#">2</a></div>
<div id="Layer3" class="masklayer" style="position:absolute; left:400pt; top:360pt; width:150pt; height:150pt; z-index:3; visibility: visible; background-color: #FF0000; layer-background-color: #FF0000; border: 1px none #000000;"> 
  <a href="#">3</a></div>
<div id="Layer4" class="masklayer" style="position:absolute; left:250pt; top:210pt; width:150pt; height:150pt; z-index:4; visibility: visible; background-color: #FFFF00; layer-background-color: #FFFF00; border: 1px none #000000;"> 
  <p>&nbsp;</p>
  <p><a href="#">4</a></p>
</div>
</body>
</html>

解决方案 »

  1.   

    <html>
    <head>
    <title>First Page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <style>
    <!--定义CSS样式
    #iewrap2{
    position:absolute
    }.masklayer{
    filter:revealTrans(Duration=2,Transition=12) //定义过渡效果
    visibility:hidden //将菜单层预置为不可见
    }
    -->
    </style>
    <script language="JavaScript">
    <!--
    function visibled(obj)
      {
    obj.filters.revealTrans.apply(); 
    obj.style.visibility="visible" ;
    obj.filters.revealTrans.play();
      }function hiddened(obj)
      {
    obj.filters.revealTrans.apply(); 
    obj.style.visibility="hidden" ;
    obj.filters.revealTrans.play();
      }
    p=1;
    function kk()
    {
    if(p>4)p=1;
    lay=eval("Layer"+p++);
    if(lay.style.visibility=="hidden")
    visibled(lay);
    else
    hiddened(lay);
       setTimeout("kk()",2000);
    }  
    // -->
    </script>
    </head><body bgcolor="#FFFFFF" text="#000000" onload="kk();">
    <div id="Layer1" class="masklayer" style="position:absolute; left:400pt; top:60pt; width:150pt;background-color:#00ffff; height:150pt; z-index:1; visibility: visible;"> 
          <p>&nbsp;</p>
        
      <p align="justify"><a href="#">1</a></p>
    </div>
    <div id="Layer2" class="masklayer" style="position:absolute; left:550pt; top:210pt; width:150pt; height:150pt; z-index:2; visibility: visible; background-color: #00FF00; layer-background-color: #00FF00; border: 1px none #000000;"> 
      <a href="#">2</a></div>
    <div id="Layer3" class="masklayer" style="position:absolute; left:400pt; top:360pt; width:150pt; height:150pt; z-index:3; visibility: visible; background-color: #FF0000; layer-background-color: #FF0000; border: 1px none #000000;"> 
      <a href="#">3</a></div>
    <div id="Layer4" class="masklayer" style="position:absolute; left:250pt; top:210pt; width:150pt; height:150pt; z-index:4; visibility: visible; background-color: #FFFF00; layer-background-color: #FFFF00; border: 1px none #000000;"> 
      <p>&nbsp;</p>
      <p><a href="#">4</a></p>
    </div>
    </body>
    </html>
      

  2.   

    如果想两次动作后再下一个
    可以function kk()
    {
    if(p>=5)p=1;
    lay=eval("Layer"+Math.floor(p));
    if(lay.style.visibility=="hidden")
    {
    visibled(lay);p+=0.5
    }
    else
    {
    hiddened(lay);p+=0.5
    }
       setTimeout("kk()",2000);
    }
      

  3.   

    wsj(骆驼)大哥，真是太感谢你了，我就是要你那样子的效果啦，我说怎么会两个效果一起来呢？而且前面的效果显示会被后面的盖掉，这个P的作用怎么会有这么大呢？看起来好像还没有太多的用处嘛，我想用setTimeout就是会出错，问题解决，多谢两位啦!