bootstrap 菜单之手风琴效果-白红宇

bootstrap 菜单之手风琴效果

阅读量：5267 次

发布时间：2019-06-14

本文共 3892 字，大约阅读时间需要 12 分钟。

自己用bootstrap搭了个项目，纯属娱乐。。。。为了检验学习bootstrap之成果。

效果如图：

一、搭建中发现一问题，因为以前测试都是写的html页面，这次用了母版页，点击页面的之后，页面会刷新，不会保留菜单选中状态

解决办法：用js保留上次的值，页面刷新重新赋值。给当前选中菜单添加class属性in,a标签设置为选中状态。

二、搭建的手风琴菜单格式不是很好看，微调了一下

三、搭建手风琴菜单，解析下基本原理：当div的class="panel-collapse collapse in"说明当前菜单最外层菜单被选中，如果移除class属性in,则菜单收缩。

四、粘贴下母板页面，可供参考

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="WebApplication1.data.Site1" %>            
             
             
                 
         
                 
             
                  
                       企业管理系统
        
          
     
    
             
                  
                       
                            
                                 产品管理
                
        
                
                            
                                 
           
           检验表单管理
 
           原材料录入
 
          
                    
         
                
        
            
       
            
                       
                            
                                 客户管理
                
        
                
                            
                                 
           
           供货商管理
 
           购货商管理
 
          
                    
         
                
        
            
       
            
                       
                            
                                 库存管理
                
        
                
                            
                                 
           
           库存管理
 
           入库记录
 
           出厂记录
 
          
                    
         
                
        
            
       
            
                       
                            
                                 产品追溯及公众平台
                
        
                
                            
                                 
           
           产品追溯
 
          
                    
         
                
        
            
       
            
                       
                            
                                 系统管理
                
        
                
                            
                                 
           
           操作员管理
 
           工作部门
 
           系统信息维护
 
           密码修改

最后分享bootstrap的外部文件：https://pan.baidu.com/s/1htBQa2o

转载于:https://www.cnblogs.com/zhangjd/p/8438647.html

你可能感兴趣的文章