关闭固定的侧面导航栏时如何显示图标栏?

时间:2019-01-31 05:57:06

标签: javascript jquery html css

我希望我的用户关闭侧边栏后能够查看图标。图标来自侧边栏。我需要为此添加JavaScript吗?

为您提供信息,我在侧边栏动画中使用了侧面导航推(画布)。 有人可以向我建议正确的方向吗?

1。我的侧边栏HTML代码

<body>
   <div id="mySidenav" class="sidenav">
      <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
      <a href="BranchManager.html" class="fas fa-home"> Home</a> 
      <br>
      <a href="BM.html" class="fas fa-male"> Branch Manager</a> 
      <br>
      <a href="Sales.html" class="fas fa-users"></i> Salesman</a> 
      <br>
      <a href="Teller.html" class="fas fa-users"> Teller</a> 
   </div>
</body>

2。我的侧边栏CSS代码

.sidenav {
   height: 100%;
   width: 0;
   position: fixed;
   z-index: 1;
   top: 0;
   left: 0;
   background-color: #111;
   overflow-x: hidden;
   transition: 0.5s;
   padding-top: 60px;
}

.sidenav a {
   padding: 8px 8px 8px 32px;
   text-decoration: none;
   font-size: 25px;
   color: whitesmoke;
   display: block;
   transition: 0.1s linear;
}

.sidenav a:hover {
   background-color:grey ;
}

.sidenav .closebtn {
   position: absolute;
   top: 0;
   right: 25px;
   font-size: 36px;
   margin-left: 50px;
}

[Reality [Expectation

0 个答案:

没有答案