移动端页面顶部菜单图标（3条横线）点击旋转

HTML中：

<button class="nav-mobile-button">
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
</button>

CSS中：

.nav-mobile-button{
	float: right; 
	padding: 9px 10px; 
	margin-top: 8px; 
	margin-right: 15px; 
	background-color: transparent; 
	border: 1px solid transparent; 
	outline: none;
}
.nav-mobile-button .icon-bar{
	display: block; 
	margin-top: 4px; 
	width: 22px; 
	height: 3px; 
	background: #f65d3f; 
	border-radius: 1px;
}
.rotate{
	transform-origin:center center; /*旋转中心要是正中间才行*/
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transition: transform 0.2s; 	/*过度时间 可调*/
	-webkit-transition: -webkit-transform 0.2s; 
	-moz-transition: -moz-transform 0.2s; 
	-ms-transition: