mui-popover显示、隐藏弹出菜单的方法
一.mui-popover要显示、隐藏弹出菜单,可使用锚点方式.
<div id="popover" class="box mui-popover mui-poppicker mui-popover-action mui-popover-bottom"
style="height: 500px;background-color: #fff;">
<div class="mui-popover-arrow"></div>
<div class="popoverheader">
<div class="text">添加教育经历</div>
<a href="#popover"><img src="../image/close.png" alt=""></a>
</div> <form class="mui-input-group" style="margin-right: 0rem;margin-left: 0rem">
<div class="mui-input-row poschoolName">
<label>学校名称</label>
<input id="poschoolName" type="text" placeholder="填写学校名称">
</div>
<div class="mui-input-row postartData">
<label>入学日期</label>
<input type="text" id="postartData" placeholder="填写入学日期">
<div class="img">
<img class="triangle" src="../image/xiala.png" alt="">
</div>
</div>
<div class="mui-input-row poendData">
<label>毕业日期</label>
<input type="text" id="poendData" placeholder="填写毕业日期">
<div class="img">
<img class="triangle" src="../image/xiala.png" alt="">
</div>
</div>
<div class="mui-input-row poschoolType">
<label>学校性质</label>
<input type="text" id="schoolType" placeholder="填写学校性质">
<div class="img">
<img class="triangle" src="../image/xiala.png" alt="">
</div>
</div>
<div class="mui-input-row pospecializedName">
<label>专业名称</label>
<input type="text" id="pospecializedName" placeholder="填写专业名称">
</div>
<div class="mui-input-row podegree">
<label>所获学位</label>
<input type="text" id="podegree" placeholder="填写所获学位">
</div>
<div class="mui-input-row pocertificateNum">
<label>证书编号</label>
<input type="text" id="pocertificateNum" placeholder="填写证书编号">
</div>
<div class="mui-input-row podegreeNum">
<label>学位编号</label>
<input type="text" id="podegreeNum" placeholder="填写学位编号">
</div>
</form>
<div class="mui-table-view mui-table-view-chevron next">
<a href="#popover" class="x-next add">添加</a> //锚点
</div>
</div>
二.通过js的方式控制弹出菜单,实现任意元素上弹出.
mui(弹出层元素).popover(status[,anchor]);
mui(弹出层元素).popover('show ');//show hide toggle
//传入toggle参数,用户也无需关心当前是显示还是隐藏状态,mui会自动识别处理;
mui(弹出层元素).popover('toggle',document.getElementById(显示位置元素));
mui-popover显示、隐藏弹出菜单的方法的更多相关文章
- PyQt(Python+Qt)学习随笔:设定toolButton弹出菜单的方法
在Qt Designer中toolButton可以通过popupMode设定菜单弹出的模式,但并不能在Qt Designer中指定toolButton的弹出菜单,toolButton只能通过代码来指定 ...
- 仿酷狗音乐播放器开发日志二十六 duilib在标题栏弹出菜单的方法
转载请说明原出处,谢谢~~ 上篇日志说明了怎么让自定义控件响应右键消息.之后我给主窗体的标题栏增加右键响应,观察原酷狗后可以发现,在整个标题栏都是可以响应右键并弹出菜单的.应该的效果如下: 本以为像上 ...
- iOS_21团购_顶部菜单和弹出菜单联动
最后效果图: 各控件关系图1: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcHJlX2VtaW5lbnQ=/font/5a6L5L2T/fontsize ...
- vc++ 如何添加右键弹出菜单
一.创建新工程 二.编辑菜单资源 1.添加菜单 按"Ctrl+R",双击"Menu"图标 2.于菜单编辑器内编辑菜单 四.添加代码(红色部分) void CCM ...
- 解决Mui中popover 顶部弹出菜单弹出位置不准确以及无法收回的问题
前言 最近公司的项目转向使用Hbuilder开发移动端项目,其中想要通过在顶部标题栏加入弹出菜单的方式,来定位长列表的位置,如图所示. 问题 Mui的功能貌似还不是很完善,在使用这个弹出菜单的时候,发 ...
- Mui --- 弹出菜单
mui框架内置了弹出菜单插件,弹出菜单显示内容不限,但必须包裹在一个含.mui-popover类的div中,如下即为一个弹出菜单内容: <div id="popover" c ...
- win7系统 右击任务栏 资源管理器 弹出菜单“已固定”和“最近”项目不显示故障处理
故障描述:右击任务栏中资源管理器图标时,弹出菜单只有“资源管理器”和“解除锁定”两个项目,“已固定”和“最近”项目缺失不显示,其他程序均显示正常,只有资源管理器这样.此故障一般发生在经常使用“已固定” ...
- JavaScript 实现触点式弹出菜单插件
之前做项目时经常用到一种触点式弹出菜单或者导航的功能,这个功能的主要应用场景是:web页面中多层分级导航或者子功能目录,但又考虑到页面区域有限,于是就考虑到在鼠标移动到某导航按钮上或者点击时,系统将在 ...
- web标准(复习)--4 纵向导航菜单及二级弹出菜单
今天我们开始学习纵向导航菜单及二级弹出菜单,包含以下内容和知识点: 纵向列表 标签的默认样式 css派生选择器 css选择器的分组 纵向二级列表 相对定位和绝对定位 一.纵向列表纵向列表或称为纵向导航 ...
随机推荐
- Flutter 中的基本路由
Flutter 中的路由通俗的讲就是页面跳转.在 Flutter 中通过 Navigator 组件管理路由导航,并提供了管理堆栈的方法.如:Navigator.push 和 Navigator.pop ...
- window系统命令cmd有哪些?
CMD命令:开始->运行->键入cmd或command(在命令行里可以看到系统版本.文件系统版本)chcp 修改默认字符集chcp 936默认中文chcp 650011. appwiz.c ...
- Review: 9-13 July
9 July 并查集 int fa[]; for (int i=1; i<=n; ++i) fa[i]=i; int f(int x){return fa[x]==x?x:fa[x]=f(fa[ ...
- linux从head.s到start_kernelstart_kernel之---内核重定位后分析
参考: https://biscuitos.github.io/blog/ARM-BOOT/ zImage 重定位之后实践 zImage 重定位之后,ARM 将 pc 指针指向了重定位 zImage ...
- 119、TensorFlow如何创建计算图
#Dataflow是并行化编程常用的方式 #当使用TensorFlow执行你的程序的时候有以下几个优点 #1.并行化 .通过声明的边来代表操作之间的依赖 # 对系统来说确定可以并行化的操作是比较容易的 ...
- swoole webSocket 聊天室示例
swoole1.7.9增加了内置的WebSocket服务器支持,通过几行PHP代码就可以写出一个异步非阻塞多进程的WebSocket服务器. 基于swoole websocket的用户上下线通知,在线 ...
- QTP 通过URL地址下载文件到本地(转)
While automation, you may come to situations where you need to need to download a file on clicking a ...
- Cocos2d Box2D之动态刚体
| 版权声明:本文为博主原创文章,未经博主允许不得转载. b2_dynamicBody 动态物体可以进行全模拟.用户可以用手手动移动动态刚体,也可以由动态刚体自己受力而自运动.动态物体可以和任何物 ...
- 利用程序随机构造N个已解答的数独棋盘
高级软件工程第二次作业:利用程序随机构造N个已解答的数独棋盘,代码如下: package SudokuGame; /** * 解决这个问题使用的是回溯+剪枝的算法 * 基本思想:不断地将每个格子可填入 ...
- javaIO流(四)--输入与输出支持
一.打印流 如果现在要想通过程序实现内容的输出,核心的本质一定要依靠OutputStream类来支持但是OutputStream类有一个最大的缺点,这个类的数据输出操作功能有限,所有的数据一定要转为字 ...