显示/隐藏菜单【知识点】if( $('#id').is(':visible') == false){}

效果描述:点击隐藏菜单按钮隐藏左侧导航栏同时按钮文字变为显示菜单,再点击显示左侧导航同时文字变为隐藏菜单;

效果图:

显示/隐藏菜单【知识点】if( $('#id').is(':visible') == false){}

显示/隐藏菜单【知识点】if( $('#id').is(':visible') == false){} 

//显示隐藏左侧导航栏
		$('#link_1').click(function() {
			if( $('#leftmenu').is(':visible') == false){
				$('#leftmenu').css('display','block');
				$(this).children('a').text('隐藏菜单')
			}else{
				$('#leftmenu').css('display','none');
				$(this).children('a').text('显示菜单')
			}
		})

给隐藏菜单的按钮添加click事件,改变leftmenu的样式,设置display值为none隐藏菜单;但是在点击时让其再显示,需要添加if判断条件if( $('#leftmenu').is(':visible') == false){},如果菜单栏不可以看到则让display变为block,同时改变文字;