java 左侧菜单栏收缩_后台管理左侧菜单收缩自如

<

Title

.hide{

display: none;

}

.item .header{

height: 35px;

background-color: #2459a2;

color: white;

line-height: 35px;

}

.item .header:hover{

height: 35px;

background-color: black;

color: yellow;

line-height: 35px;

}

菜单1

内容1

内容1

内容1

菜单2

内容2

内容2

内容2

菜单3

内容3

内容3

内容3

菜单4

内容4

内容4

内容4

function ChangeMenu(nid){

var current_header = document.getElementById(nid);

var item_list = current_header.parentElement.parentElement.children;

for(var i=0;i

var current_item = item_list[i];

current_item.children[1].classList.add('hide');

}

current_header.nextElementSibling.classList.remove('hide');

}