Skip to content

T
tl_estate
Commit 7af3dcdd authored by xinyuandu's avatar xinyuandu
Browse files
Options

修改隐藏/显示菜单的样式

parent ca87574a
Hide whitespace changes
Inline Side-by-side
Showing with 63 additions and 10 deletions
application/index/view/global/frame_tpl.html
View file @ 7af3dcdd
...@@ -10,6 +10,33 @@ ...@@ -10,6 +10,33 @@
<link rel="stylesheet" href="/resource/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="/resource/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="/resource/css/bootstrap-datetimepicker.min.css"> <link rel="stylesheet" href="/resource/css/bootstrap-datetimepicker.min.css">
<title>同联商业</title> <title>同联商业</title>
<style>
/*隐藏显示按钮(梯形)样式代码*/
.hideBtn1{
position: relative;
right:-1px;
border-top: 0px solid transparent;
border-bottom: 20px solid transparent;
border-right: 22px solid #1a1a1a;
border-left: 0px solid #1a1a1a ;
height: 80px;
width: 0;
line-height: 20px;
font-size:12px;
}
.hideBtn2{
position: relative;
right:-1px;
border-top: 0px solid transparent;
border-bottom: 20px solid transparent;
border-right: 0px solid #ff9419;
border-left: 22px solid #ff9419 ;
height: 80px;
width: 0;
line-height: 20px;
font-size:12px;
}
</style>
</head> </head>
<body> <body>
...@@ -35,15 +62,18 @@ ...@@ -35,15 +62,18 @@
</ul> </ul>
</div> </div>
</div> </div>
<!--添加隐藏按钮-->
<div id="hide_menu"> <!--<div id="hideLine" style="width:2px;height:80px;background-color: #000000;float:left;display:inline;display:none"></div>
<span class="width-136-hide"> --><!--添加隐藏按钮-->
隐藏 <div id="hide_menu" class="" style="width:2%;display:inline;">
<div class="width-136-hide hideBtn1" style=";text-align:center;">
<span style="position:relative;left:3px;top:10px">隐藏</span>
<!--<img src="/resource/image/icon_down@2x.png" class="text-icon-hide"/>--> <!--<img src="/resource/image/icon_down@2x.png" class="text-icon-hide"/>-->
</span> </div>
</div> </div>
<div id="wrapper"> <div id="wrapper" style="width:98% !important;float:right !important;display:inline">
{include file="global/navigation" /} {include file="global/navigation" /}
{__CONTENT__} {__CONTENT__}
{include file="global/footer_tpl" /} {include file="global/footer_tpl" /}
......
public/resource/css/public.css
View file @ 7af3dcdd
...@@ -99,6 +99,13 @@ a:hover{ ...@@ -99,6 +99,13 @@ a:hover{
width: 12%; width: 12%;
z-index: 1000; z-index: 1000;
float: left; float: left;
animation: myfirst s;
}
@keyframes myfirst
{
0% { width:0%}
100% {width : 12%}
} }
#sidebar-wrapper::-webkit-scrollbar { #sidebar-wrapper::-webkit-scrollbar {
...@@ -130,7 +137,7 @@ a:hover{ ...@@ -130,7 +137,7 @@ a:hover{
line-height: 36px; line-height: 36px;
text-align: center; text-align: center;
float: left; float: left;
background-color: rgba(0,0,0,.2); /*background-color: rgba(0,0,0,.2);*/
font-size:15px; font-size:15px;
cursor:pointer; cursor:pointer;
...@@ -254,6 +261,11 @@ a:hover{ ...@@ -254,6 +261,11 @@ a:hover{
.span-list{ .span-list{
margin-left: 6px; margin-left: 6px;
} }
.span-list:hover {
font-size:14px;
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus { .dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus {
background:rgba(255,148,25,0.1) !important; background:rgba(255,148,25,0.1) !important;
} }
......
public/resource/js/public.js
View file @ 7af3dcdd
...@@ -103,14 +103,25 @@ define(['doT', 'jquery', 'text!temp/menu_template_tpl.html', 'layer'], function ...@@ -103,14 +103,25 @@ define(['doT', 'jquery', 'text!temp/menu_template_tpl.html', 'layer'], function
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var _this = $(this); var _this = $(this);
if($.trim(_this.html()).indexOf("隐藏")!=-1){ if($('.width-136-hide').find('span').text() == "隐藏"){
//if($.trim(_this.html()).indexOf("隐藏")!=-1){
//$('#hideLine').show();
$('.width-136-hide').removeClass("hideBtn1");
$('.width-136-hide').addClass("hideBtn2");
$('.width-136-hide').find('span').css("left","-17px");
$('#sidebar-wrapper').hide(); $('#sidebar-wrapper').hide();
_this.html('显示<img src="/resource/image/icon_down_hide@2x.png" class="text-icon-hide"/>'); $('.width-136-hide').find('span').text("显示");
//_this.html('显示<img src="/resource/image/icon_down_hide@2x.png" class="text-icon-hide"/>');
$("#page-content-wrapper").css("width","100%");//内容显示大小 $("#page-content-wrapper").css("width","100%");//内容显示大小
}else{ }else{
//$('#hideLine').hide();
$('.width-136-hide').removeClass("hideBtn2");
$('.width-136-hide').addClass("hideBtn1");
$('.width-136-hide').find('span').css("left","3px");
$('#sidebar-wrapper').show(); $('#sidebar-wrapper').show();
_this.html('隐藏<img src="/resource/image/icon_down@2x.png" class="text-icon-hide"/>'); //_this.html('隐藏<img src="/resource/image/icon_down@2x.png" class="text-icon-hide"/>');
$("#page-content-wrapper").css("width","88%");//内容显示大小 $("#page-content-wrapper").css("width","88%");//内容显示大小
$('.width-136-hide').find('span').text("隐藏");
} }
}); });
//显示操作里的按钮 //显示操作里的按钮
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment