zoukankan      html  css  js  c++  java
  • asp2.0 中实现 msdn 左边导航栏

     
    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head id="Head1"  runat=server >
        
    <title>Untitled Page</title>
        
        
    <script>
         
    function change()
         

          
           
    var divs= document.getElementsByTagName("div")
            
    for (var k=0;k<divs.length;k++)
            
    {  
                    
    var flag=divs[k].id+"";
                    
    var flagarray=new Array();
                        flagarray
    =flag;
                    
    if ((flag.substring(0,15)=="NavigationMenun")&&(flag.length==21) )
                       
                     
    { alert(divs[k].id);
                        
    var tables=divs[k].getElementsByTagName("table");
                        
    var select=tables[0];
                        select.style.borderColor
    ="#9C9A9C";
                        select.style.borderWidth
    ="1px";
                        select.style.borderStyle
    ="Solid";
                        select.style.width
    ="160";
                     }

            }

          
          
              }

              
             
        
    </script>

    </head>
    <body onload="change()">
        
    <form id="form1" runat="server" >
       
        
    <div>
           
    <asp:menu id="NavigationMenu"
            disappearafter
    ="2000"
            staticdisplaylevels
    ="2"
            staticsubmenuindent
    ="10" 
            orientation
    ="Vertical"
            font-names
    ="Arial" 
            target
    ="_blank"  
            runat
    ="server" style="background-color: #f7f3f7; border-right: #9c9a9c 1px solid; border-top: #9c9a9c 1px solid; border-left: #9c9a9c 1px double; border-bottom: #9c9a9c 1px solid;" Height="13px" Width="191px">
            
            
    <staticmenuitemstyle backcolor="#F7F3F7"
              forecolor
    =Black />
            
    <statichoverstyle backcolor="#CECFCE" BorderStyle=Solid  BorderWidth=1px BorderColor="#9C9A9C" ForeColor=Black/>
            
    <dynamicmenuitemstyle backcolor="#F7F3F7"
              forecolor
    =Black    />
            
    <dynamichoverstyle backcolor="#CECFCE"
              forecolor
    ="Black"  BorderStyle=Solid  BorderWidth=1px BorderColor="#9C9A9C"/>

            
    <items>
              
    <asp:menuitem navigateurl="Home.aspx" 
                text
    ="中国"
                tooltip
    ="Home" Value="Home" >
                
    <asp:menuitem navigateurl="Music.aspx"
                  text
    ="Music"
                  tooltip
    ="Music" Value="Music">
                  
    <asp:menuitem navigateurl="Classical.aspx" 
                    text
    ="Classical"
                    tooltip
    ="Classical" Value="Classical"/>
                  
    <asp:menuitem navigateurl="Rock.aspx"
                    text
    ="Rock"
                    tooltip
    ="Rock" Value="Rock"/>
                  
    <asp:menuitem navigateurl="Jazz.aspx"
                    text
    ="Jazz"
                    tooltip
    ="Jazz" Value="Jazz"/>
                
    </asp:menuitem>
                
    <asp:menuitem navigateurl="Movies.aspx"
                  text
    ="Movies"
                  tooltip
    ="Movies" Value="Movies">
                  
    <asp:menuitem navigateurl="Action.aspx"
                    text
    ="Action"
                    tooltip
    ="Action" Value="Action"/>
                  
    <asp:menuitem navigateurl="Drama.aspx"
                    text
    ="Drama"
                    tooltip
    ="Drama" Value="Drama"/>
                  
    <asp:menuitem navigateurl="Musical.aspx"
                    text
    ="Musical"
                    tooltip
    ="Musical" Value="Musical"/>
                
    </asp:menuitem>
              
    </asp:menuitem>
            
    </items>
          
          
    </asp:menu>

            
    &nbsp;&nbsp;&nbsp;
        
    </div>
        
    </form>
    </body>
    </html>


    注意javascrip .

     
    function change()
         { 
          
           
    var divs= document.getElementsByTagName("div")
            
    for (var k=0;k<divs.length;k++)
            {  
                    
    var flag=divs[k].id+"";
                    
    var flagarray=new Array();
                        flagarray
    =flag;
                    
    if ((flag.substring(0,15)=="NavigationMenun")&&(flag.length==21) )
                       
                     { alert(divs[k].id);
                        
    var tables=divs[k].getElementsByTagName("table");
                        
    var select=tables[0];
                        select.style.borderColor
    ="#9C9A9C";
                        select.style.borderWidth
    ="1px";
                        select.style.borderStyle
    ="Solid";
                        select.style.width
    ="160";
                     }
            }
          
          
              }
              
      效果不在完美...如下 
     
  • 相关阅读:
    爬虫的简单运用
    预测体育竞技比赛结果(新人练手)
    自己的第一个网页
    科学计算和可视化(numpy及matplotlib学习笔记)
    面向对象总结
    PIL库的总结及运用
    jirba库的使用和好玩的词云
    第一次结队作业
    四则运算版本升级
    自动生成小学四则运算项目练习(已更新)
  • 原文地址:https://www.cnblogs.com/gwazy/p/178547.html
Copyright © 2011-2022 走看看