点击空白处,左侧菜单栏滑出页面
来源:互联网 发布:淘宝猝死 编辑:程序博客网 时间:2024/06/15 19:03
html结构:
左侧菜单栏结构:
页面效果:
页面左侧中有一个按钮,左侧菜单通过点击这个按钮滑入,再次点击按钮菜单滑出,这里需要实现另一个功能是点击页面除左侧菜单栏外的空白处,左侧菜单也滑出页面。
代码实现为
$(document).click(function(e){ var _con = $('#main-sidebar'); // 设置目标区域1--左侧菜单 var _con1=$("#sidebar-menu-control");//设置目标区域2--控制菜单滑进滑出的按钮 var left=$('#main-sidebar').css("left"); if((!_con.is(e.target) && _con.has(e.target).length === 0)&&(!_con1.is(e.target) && _con1.has(e.target).length === 0)){ $('#main-sidebar').animate({"left":"-294px"},"slow"); } });
阅读全文
0 0
- 点击空白处,左侧菜单栏滑出页面
- 点击文字左侧滑出菜单
- 关于左侧菜单栏,点击二级菜单栏展开
- 左侧菜单栏如何延伸到页面最底部
- 织梦dedecms 后台左侧菜单栏空白问题(PHP7)
- 左侧固定菜单栏,页面滚动定位(菜单栏定位)
- iframe 点击左侧菜单栏 右侧显示相应的网页内容
- HTML页面左侧菜单栏切换实现右侧主体内容改变
- 左侧页面缩略,点击右侧切换
- 当点击页面空白处时,隐藏软键盘
- 点击页面空白处时隐藏弹出的div层
- Bootstrap 模态框在点击页面空白处关闭
- Android页面中点击空白处隐藏软键盘
- 阻止Bootstrap 模态框在点击页面空白处关闭方法
- jquery实现点击页面空白处,弹框消失
- 点击页面空白处关闭气泡或弹层
- 菜单栏滑动滑出效果
- 点击空白处隐藏
- 内部类之局部内部类
- 零基础入门黑客,附学习资料打包全送
- Hibernate懒加载问题导致View层无法获取关联数据的问题
- 浅谈工业级物联网项目架构设计及实施
- 人生苦短,我用python 一
- 点击空白处,左侧菜单栏滑出页面
- 嵌入式系统平台,读取framebuffer保存为png图片
- 移位运算
- Activity之间的跳转及销毁所有Activity的正确姿势
- Android——自定义View实现9宫格解锁
- 作为一种服务的灾难恢复的案例
- adb操作命令详解及大全
- 视频编码综述
- 控件抛物线轨迹的实现