一个简单的滑动门效果代码

//滑动门
function menu(a,idName,cssName)
{

   for(i=1;i<=2;i++)
   {
        if(i==a)
        {
            document.getElementById(idName+a).style.display="";
            document.getElementById(cssName+a).className="type";
        }
        else
        {
              document.getElementById(idName+i).style.display="none";
              document.getElementById(cssName+i).className="";
        }
   }
   
}

html代码

 

<td width="82" height="25" align="center" valign="bottom" background="images/sh_b4.jpg" style="cursor:hand" mce_style="cursor:hand" onmouseover="menu(1,'a','type');"><span id="type1" class="type">政策法规</span></td> <td width="10"> </td> <td width="82" height="25" align="center" valign="bottom" background="images/sh_b5.jpg" style="cursor:hand" mce_style="cursor:hand" onmouseover="menu(2,'a','type');"><span id="type2" >参政议政</span></td> <td> </td><table width="100%" border="0" cellspacing="0" cellpadding="1" id="a1" > <!--政策法规--> <asp:Repeater ID="fagui" runat="server"> <ItemTemplate> <tr> <td>·<a href="#?id=<%# DataBinder.Eval(Container.DataItem,"newsID")%>"><%# DataBinder.Eval(Container.DataItem,"newsTitle")%></a> [<%# DataBinder.Eval(Container.DataItem,"newsTime","{0:yyyy-MM-dd}")%>]<br /></td> </tr> </ItemTemplate> </asp:Repeater> </table> <table width="100%" border="0" cellspacing="0" cellpadding="1" id="a2" style="display:none;" > <!--参政--> <asp:Repeater ID="yizheng" runat="server"> <ItemTemplate> <tr> <td>·<a href="#?id=<%# DataBinder.Eval(Container.DataItem,"newsID")%>"><%# DataBinder.Eval(Container.DataItem,"newsTitle")%></a> [<%# DataBinder.Eval(Container.DataItem,"newsTime","{0:yyyy-MM-dd}")%>]<br /></td> </tr> </ItemTemplate> </asp:Repeater> </table>