我做了一个侧面导航菜单,点击一个按钮从左到右滑动.
$(document).ready(function(){
$("#nav-toggle").click(function(){
$("#page").toggleClass("margin");
});
});
Run Code Online (Sandbox Code Playgroud)
当点击'#nav-toggle'按钮时,'#page'边距从0px增加到600px.
.margin {
margin-left:600px;width:380px;overflow-x:hidden
}
<div id="side-menu">
<nav>
<a class="nav-links" href="#home">home</a>
<a class="nav-links" href="#about">about</a>
<a class="nav-links" href="#contact">contact</a>
</nav><!-- end of nav -->
Run Code Online (Sandbox Code Playgroud)
如何通过点击它外面关闭菜单.
$('body').on('click',function(event){
if(!$(event.target).is('#nav-toggle')){
$("#page").removeClass("margin");
}
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
7205 次 |
| 最近记录: |