利用js在asp.net中实现左导航页的隐藏_asp.net技巧

    作者:DotSharp

    我们在CSDN论坛上的左上角能够看到导航栏的功能,下面就模拟该功能,利用JS在asp.net中作一个简单的无刷新的左导航栏隐藏功能.

    首先,作一个框架页,我们取名 main.aspx
<!– main.aspx 主要代码 –>
<script>
document.write(“<frameset rows=54,28,*,19 frameborder=NO border=0 framespacing=0>”);
document.write(“<frame src=title.aspx name=topFrame scrolling=NO noresize>”);
document.write(“<frame src=bar.aspx name=MainNaviFrame scrolling=NO>”);
<!– left.aspx是导航页 ,menuswitch.aspx是交互的按钮页 –>
document.write(“<frameset name=forum cols=150,8,* frameborder=NO border=0 framespacing=0>”);
document.write(“<frame src=left.aspx name=LeftFrame scrolling=auto>”);
document.write(“<frame src=menuswitch.aspx name=SwichFrame scrolling=No>”);

document.write(“<frameset rows=100%,* frameborder=NO border=0 framespacing=0>”);
document.write(“<frame src= name=MainFrame scrolling=no>”);
document.write(“</frameset></frameset>”);
document.write(“<frame src=bottom.aspx name=BottomFrame scrolling=No></frameset>”);
</script>

<!– menuswitch.js 主要代码–>
var leftwin = true;

function changeWin()
{
 if(leftwin == true)
 {
  parent.forum.cols = “0,8,*”;
  parent.SwichFrame.menuSwitch.innerHTML = “<a onclick=changeWin(); style=cursor:hand;><img src=images/ArrowOpen.gif border=0></a>”;
  leftwin = false;
 }
 else
 {
  parent.forum.cols = “150,8,*”;
  parent.SwichFrame.menuSwitch.innerHTML = “<a onclick=changeWin(); style=cursor:hand;><img src=images/ArrowClose.gif border=0></a>”;
  leftwin = true;
 }
}

<!– menuswitch.aspx 主要代码 –>
<table height=”100%” cellSpacing=”0″ cellPadding=”0″ width=”8″ background=”images/MiddleBg1.gif”
 border=”0″>
 <tr>
  <td onclick=”changeWin();” style=”cursor:hand;” id=”menuSwitch” align=”center”>
   <img id=”Image1″ src=”http://www.knowsky.com/images/ArrowClose.gif” border=”0″ />
  </td>
 </tr>
</table>

以上功能并不完善,只能起到抛砖引玉的作用,欢迎网友与我交流.