[HTML]如何实现导航栏的从左滑入效果：点击隐藏，再次点击消失

首先是html代码：

然后是javascript代码（使用jquery实现）：

$(document).ready(function(){
    var isHiden = true;	/*控制切换菜单*/
    $('#popView').click(function(){
        if(isHiden){
			$('#popView').animate({left:'+=380px'});//菜单块向右移动
		}else{
			$('#popView').animate({left:'-=380px'}); //菜单块向左移动
		}
		isHiden = !isHiden;
    });
});

最后是css代码：

/*弹出菜单*/
#popView{
	/*左侧弹出窗口的长宽、圆角、背景颜色*/
	height: 400px;
	width: 400px;
	border-radius: 10px;
	background-color: #7AC5CD;


	/*布局排版*/
	position:absolute;
	z-index:2;
	left:-390px;

	/*字体设置*/
	text-align: center;
	color: #FFFFFF;
}	

运行效果如图：

点击之后导航栏从左向右滑入：