通过JS判断侧滑边栏是否滑出,获取开关状态

[复制链接]
一门APP@侧边栏Lv.7 显示全部楼层 发表于 2019-7-24 16:23:19 |阅读模式 打印 上一主题 下一主题
安卓上架
侧滑边栏是否已开启(已滑出)
  1. jsBridge.sidebarIsOpen(function(yes) {
  2.   alert(yes ? "已开启" : "已关闭");
  3. });
复制代码
JS按钮换出.jpg
sidebarOpen 打开(滑出)边栏
  1. jsBridge.sidebarOpen();
复制代码
sidebarClose 关闭边栏
  1. jsBridge.sidebarClose();
复制代码
浮出关闭.jpg


sidebarHeader 头部设置(A)
  1. jsBridge.sidebarHeader({
  2.   background: '#DD3333',
  3.   textColor : '#FFFFFF',
  4.   icon      : 'https://s.yimenyun.net/sys/avatar.png',
  5.   text      : '显示在图标下面的文字',
  6.   action    : 'javascript:alert("你点击了头部")'
  7. });
  8. alert("已设置");
  9. jsBridge.sidebarOpen();
  10. /**
  11. {
  12.   background: //背景色或背景图片,背景色用 #RRBBGG 格式,背景图用图片链接
  13.   textColor : //文字颜色
  14.   icon      : //图标链接
  15.   text      : //显示在图标下面的文字
  16.   action    : //点击头部需要执行的操作,一个合法的 uri 或者一段 js 脚本
  17. }
  18. **/
复制代码
真机效果
滑动自定义.jpg


sidebarHeader 头部设置(B)
  1. jsBridge.sidebarHeader({
  2.   background: 'https://s.yimenyun.net/sys/sm6.jpg',
  3.   textColor : '#FFFFFF',
  4.   icon      : 'https://s.yimenyun.net/sys/avatar2.png',
  5.   text      : '请登录',
  6.   action    : 'javascript:alert("你点击了头部")'
  7. });
  8. alert("已设置");
  9. jsBridge.sidebarOpen();
复制代码
真机效果
侧滑定义JS.jpg



sidebarHeader 头部设置(C)
  1. jsBridge.sidebarHeader({
  2.   background: 'https://s.yimenyun.net/sys/sm3.jpg',
  3.   textColor : '#FF0000',
  4.   icon      : 'https://s.yimenyun.net/sys/avatar.png',
  5.   text      : '相见恨晚',
  6.   action    : 'https://www.yimenapp.com/'
  7. });
  8. alert("已设置");
  9. jsBridge.sidebarOpen();
复制代码
真机效果
滑动JS自定义3.jpg


查看DEMO方式
https://www.yimenAPP.com/doc/demo_sidebar.cshtml打包成APP,即刻体验!
侧滑JS.png

之后就可以真机体验效果了

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

一门APP打包致力于H5混合APP基础框架领域的前沿探索,专注轻便的移动应用解决方案 提供基于HTML前端页面在各种应用层级的端延展。
  • 官方手机版

  • 微信公众号

  • 微信客服

  • Powered by Discuz! X3.4 | Copyright © 2001-2020, 一门APP. | 一门APP开发平台|热门标签
  • 蜀ICP备17005078号-4 | 川公网安备 51019002001185号 | |成都七扇门科技有限公司