利用JS在asp.net中實現左導航頁的隱藏

我們在CSDN論壇上的左上角能夠看到導航欄的功能,下麵就模擬該功能,利用JS在asp.net中作一個簡單的無刷新的左導航欄隱藏功能.

首先,作一個框架頁,我們取名main.aspx

<!--main.aspx主要代碼--> <script> document.write("<framesetrows='54,28,*,19'frameborder='NO'border='0'framespacing='0'>"); document.write("<framesrc='title.aspx'name='topFrame'scrolling='NO'noresize>"); document.write("<framesrc='bar.aspx'name='MainNaviFrame'scrolling='NO'>"); <!--left.aspx是導航頁,menuswitch.aspx是交互的按鈕頁--> document.write("<framesetname='forum'cols='150,8,*'frameborder='NO'border='0'framespacing='0'>"); document.write("<framesrc='left.aspx'name='LeftFrame'scrolling='auto'>"); document.write("<framesrc='menuswitch.aspx'name='SwichFrame'scrolling='No'>"); document.write("<framesetrows='100%,*'frameborder='NO'border='0'framespacing='0'>"); document.write("<framesrc=''name='MainFrame'scrolling='no'>"); document.write("</frameset></frameset>"); document.write("<framesrc='bottom.aspx'name='BottomFrame'scrolling='No'></frameset>"); </script> <!--menuswitch.js主要代碼--> varleftwin=true; functionchangeWin() { if(leftwin==true) { parent.forum.cols="0,8,*"; parent.SwichFrame.menuSwitch.innerHTML="<aonclick='changeWin();'style='cursor:hand;'><imgsrc='images/ArrowOpen.gif'border='0'></a>"; leftwin=false; } else { parent.forum.cols="150,8,*"; parent.SwichFrame.menuSwitch.innerHTML="<aonclick='changeWin();'style='cursor:hand;'><imgsrc='images/ArrowClose.gif'border='0'></a>"; leftwin=true; } } <!--menuswitch.aspx主要代碼--> <tableheight="100%"cellSpacing="0"cellPadding="0"width="8"background="images/MiddleBg1.gif" border="0"> <tr> <tdalign="center"> <imgsrc="images/ArrowClose.gif"border="0"/> </td> </tr> </table>

以上功能並不完善,隻能起到拋磚引玉的作用,歡迎網友與我交流.