<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <base href="<%=basePath%>"> <title></title> <link rel="stylesheet" href="admin/css/basic.css" type="text/css" /> <link rel="stylesheet" href="admin/css/sideMenu.css" type="text/css" /> <script language="javascript"> /*共用*/ function $(id) { return document.getElementById(id); } window.onload = function() { var countId1 = 0; $("Id1").onclick = function() { var Id1 = $("Id1"); var Id1Hover = $("Id1Hover"); if (countId1 % 2 == 0) { Id1Hover.style.display = "block"; Id1.style.backgroundImage = "url(admin/images/buttom.jpg)"; Id1.style.backgroundRepeat = "no-repeat"; Id1.style.color = "#b6241f"; } else { Id1Hover.style.display = "none"; Id1.style.backgroundImage = "url(admin/images/buttomHover.jpg)"; Id1.style.backgroundRepeat = "no-repeat"; Id1.style.color = "#fff"; } countId1++; }; var countId2 = 0; $("Id2").onclick = function() { var Id2 = $("Id2"); var Id2Hover = $("Id2Hover"); if (countId2 % 2 == 0) { Id2Hover.style.display = "block"; Id2.style.backgroundImage = "url(admin/images/buttom.jpg)"; Id2.style.backgroundRepeat = "no-repeat"; Id2.style.color = "#b6241f"; } else { Id2Hover.style.display = "none"; Id2.style.backgroundImage = "url(admin/images/buttomHover.jpg)"; Id2.style.backgroundRepeat = "no-repeat"; Id2.style.color = "#fff"; } countId2++; }; var countId3 = 0; $("Id3").onclick = function() { var Id3 = $("Id3"); var Id3Hover = $("Id3Hover"); if (countId3 % 2 == 0) { Id3Hover.style.display = "block"; Id3.style.backgroundImage = "url(admin/images/buttom.jpg)"; Id3.style.backgroundRepeat = "no-repeat"; Id3.style.color = "#b6241f"; } else { Id3Hover.style.display = "none"; Id3.style.backgroundImage = "url(admin/images/buttomHover.jpg)"; Id3.style.backgroundRepeat = "no-repeat"; Id3.style.color = "#fff"; } countId3++; }; var countId4 = 0; $("Id4").onclick = function() { var Id4 = $("Id4"); var Id4Hover = $("Id4Hover"); if (countId4 % 2 == 0) { Id4Hover.style.display = "block"; Id4.style.backgroundImage = "url(admin/images/buttom.jpg)"; Id4.style.backgroundRepeat = "no-repeat"; Id4.style.color = "#b6241f"; } else { Id4Hover.style.display = "none"; Id4.style.backgroundImage = "url(admin/images/buttomHover.jpg)"; Id4.style.backgroundRepeat = "no-repeat"; Id4.style.color = "#fff"; } countId4++; }; }; </script> </head> <%! //统计访问次数 public synchronized void browCount(ServletContext application) { if (application.getAttribute("brow") == null) { application.setAttribute("brow", 1); } else { int count = Integer.parseInt(application.getAttribute("brow") .toString()); application.setAttribute("brow", count + 1); } }%> <% browCount(application); %> <body> <div class="sideMenu"> <div class="logo"> <img src="admin/images/logo.jpg" width="153" height="75" /> </div> <div class="info"> <p class="p1">管理员:${adminName}</p> <p class="p2"> <a href="admin/AdminLogout.jsp">注销</a> <a href="###" target="_blank">打开新蛋首页</a> </p> <p class="p3">统计访问次数:<%=application.getAttribute("brow") %></p> </div> <h3> <a id="Id1">用户管理</a> </h3> <ul id="Id1Hover" style="display:none;"> <li><a href="userList" target="main">用户管理</a> </li> <c:if test="${uList.ne_level_id eq '3'}"> <li><a href="userNew" target="main">新增管理员</a> </li> </c:if> </ul> <h3> <a id="Id2">商品信息</a> </h3> <ul id="Id2Hover" style="display:none;"> <c:if test="${uList.ne_level_id eq '3'}"> <li><a href="classUpdate" target="main">分类管理</a> </li> <li><a href="classNew" target="main">创建分类</a> </li> </c:if> <li><a href="goodsList?substance=" target="main">商品管理</a> </li> <li><a href="goodsNew" target="main">新增商品</a> </li> </ul> <h3> <a id="Id3">订单管理</a> </h3> <ul id="Id3Hover" style="display:none;"> <li><a href="orderList" target="main">订单管理</a> </li> </ul> <h3> <a id="Id4">评论管理</a> </h3> <ul id="Id4Hover" style="display:none;"> <li><a href="commentList" target="main">评论管理</a> </li> </ul> </div> </body> </html>
/* CSS Document */ .sideMenu{ width:153px;} .logo{ width:153px; height:75px;} .info{ height:75px; width:145px; border:1px solid #bcbcbc; border-top:none; font-family:"微软雅黑"; line-height:21px; padding-left:6px;} .info .p1{ padding-top:5px; color:#333;} .info .p2{ color:#039;} .info .p2 a{ color:#039;} .info .p3{ color:#999;} h3{ background:url(../images/sidebarTitle.jpg) repeat-x; height:26px; width:153px; color:#fff; font-size:12px; font-family:"微软雅黑";;} h3 a{ color:#fff; font-size:12px; background:url(../images/buttomHover.jpg) no-repeat; padding-left:30px; height:26px; display:block; line-height:26px;} h3 a:hover{ color:#b6241f;} ul{ background:#d4e7f9; font-family:"微软雅黑";} ul li{ background:url(../images/sidebarBj.jpg) no-repeat; height:26px; line-height:26px; padding-left:36px;} ul li a { color:#203c73;}
效果图:
相关推荐
iOS侧栏菜单 SlideMenuControllerOC ,iOS侧栏菜单,一个类似于iQON, Feedly, Google , Ameba 等App的侧栏菜...
京东新版侧栏jquery导航.zip
侧栏全屏响应式商业bootstrap后台模板_全屏 响应式 手机 二栏 侧栏 商业 后台 bootstrap 后台系统 .zip侧栏全屏响应式商业bootstrap后台模板_全屏 响应式 手机 二栏 侧栏 商业 后台 bootstrap 后台系统 .zip
左栏全屏响应式工业机械行业模板_全屏 响应式 工业 机械 建筑 整站 bootstrap 响应式 手机 侧栏 设计 展示.zip左栏全屏响应式工业机械行业模板_全屏 响应式 工业 机械 建筑 整站 bootstrap 响应式 手机 侧栏 设计 ...
BorderMenu特别的侧栏菜单库.rar,太多无法一一验证是否可用,程序如果跑不起来需要自调,部分代码功能进行参考学习。
左栏全屏响应式工业机械行业模板_全屏 响应式 工业 机械 建筑 整站 bootstrap 响应式 手机 侧栏 设计 展.rar
左栏全屏响应式工业机械行业模板_全屏 响应式 工业 机械 建筑 整站 bootstrap 响应式 手机 侧栏 设计 展示.rar
iOS 功能健全的侧栏 Panel 效果。.zip,FAPanels - Swift
jQuery展开折叠侧栏导航菜单基于jquery.1.5.1.js制作,蓝色风格,点击菜单收缩折叠效果,适合OA办公、会员中心等后台系统使用,有个人中心、课程中心、校内讨论、资源中心等菜单栏目。
亮红色个性杂志翻页效果个人主页模板_红色个性杂志翻页博客设计师作品展示个人个人主页blog仿flashjquerybootstrap菜单侧栏menuwap菜单
这是一款基于 jQuery 实现的插件,用于使程序员能够轻松的完成侧栏的开发工作,提升工作效率,适用于一般性的垂直站点。 运行效果 标签:multSideBar
微信小程序之侧栏菜单,微信UI界面设计范例。在一些微信商城小程序中,一般都会有分类页面,可以给用户快速找到相关的商品,设计开发成如下图所示的效果,原理是使用了左右两个盒子,左盒子使用标准流,右盒子使用...
HSImageSidebarView, 在苹果iPad应用的Keynote中,一个基于侧栏的视图 HSImageSidebarViewHSImageSidebarView 是 UIView的子类,用于显示图像集合。 图像按水平或者垂直排列,具体取决于视图的尺寸。 它支持选择。...
html资源
PHP视频教程. PHPCMS08 列表侧栏显示.wmv
B/S(Brower/Server) 结 构 、 用 SSH 框 架 来 搭 建 MVC(Model...在每个信息模块中,应区分出个人和企业的信息,前台页面共分为四块,页头(top.jsp), 页尾(end.jsp)侧栏(left.jsp)以及内容显示区(default.jsp)
侧栏全屏响应式商业bootstrap后台模板5112.zip
一个非常简单易懂的侧栏菜单
ecshop侧栏展开导航 仿京东侧栏展开 复制.lib文件替换/library/文件下的lib文件即可用