adminLTE框架实现菜单下视图

<%@ page contentType="text/html;charset=UTF-8" pageEncoding="utf-8" %>
<%@ include file="/WEB-INF/common/taglibs.jsp" %>
 <div class="col-md-2" style="margin: 0px -15px">
     <div class="box box-solid" id="view-box">
       <div class="box-body no-padding">
         <ul class="nav nav-pills nav-stacked">
           <li id="demo-second-view1" style="display:none;"><a href="${ctx }/demo/second/view1.do"> view1 </a></li>
           <li id="demo-second-view2" style="display:none;"><a href="${ctx }/demo/second/view2.do"> view2</a></li>
         </ul>
       </div>
     </div>
   </div>
   <script>
  $(function(){
  //有视图,且视图和内容左右布局时,视图支持展开和折叠操作
  if($("#view-box").width() != null && $(document).width() > $("#view-box").width()){
  $("#view-open").show();
  $("#view-box").height($(".content-wrapper").height() - 35);
  $("#view-box").resize(function(){
    var display = $("#view-box").css("display");
  if(display != "none"){
  openLeft = ($("#view-box").width() - 42) +"px";
    $("#view-open").css("left",openLeft);
  }
  })
    //视图展开和折叠
    var openLeft = ($("#view-box").width() - 42) +"px";
    var closeLeft = "-42px";
    $("#view-open").css("left",openLeft);
    $("#view-open").click(function(){
    var display = $("#view-box").css("display");
    if(display == "none"){
    $("#view-box").show();
      $("#view-open").css("left",openLeft);
    $("#content-box").removeClass("col-md-12");
    $("#content-box").addClass("col-md-10");
    }else{
    $("#view-box").hide();
      $("#view-open").css("left",closeLeft);
    $("#content-box").removeClass("col-md-10");
    $("#content-box").addClass("col-md-12");
    }
    });
  }
  var path = window.location.pathname;
  var paths = path.replace(".do","").split("/").reverse();
  //展示当前二级菜单的视图
  $("li[id^='"+paths[2]+"-"+paths[1]+"']").show();
  //激活当前视图 
  $("#"+paths[2]+"-"+paths[1]+"-"+paths[0]).addClass("active");
  })
  </script>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值