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(显示位置元素)); 

原文地址:https://www.cnblogs.com/lyt0207/p/11800119.html

时间: 2024-08-24 05:35:35

mui-popover显示、隐藏弹出菜单的方法的相关文章

iOS_21团购_顶部菜单和弹出菜单联动

最后效果图: 各控件关系图1: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcHJlX2VtaW5lbnQ=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" >\ 各控件关系图2: 点击Dock上面的buttonDockItem, 创建经导航控制器包装的DealListController, 而且加入到主控制器的右側空间 // // Deal

iOS开发——实战技术OC篇&amp;关于蒙板和弹出菜单

关于蒙板和弹出菜单 一:关于蒙板 蒙板的作用一般就是用来实现不能做其他操作还有一些模糊效果提示用户 我们只需要自定义一个View,并且创建两个类方法用来给外界调用实现显示和隐藏 + (void)show; + (void)hide; 显示:直接添加到window上,并且设置和window同样大小,然后设置相应的透明度(alpla) 1 + (void)show 2 3 { 4 5 6 7 8 9 iCocosCover *cover = [[self alloc] init]; 10 11 12

vc++ 如何添加右键弹出菜单

一.创建新工程 二.编辑菜单资源 1.添加菜单 按"Ctrl+R",双击"Menu"图标 2.于菜单编辑器内编辑菜单 四.添加代码(红色部分) void CCMenuView::OnUpdateShow(CCmdUI* pCmdUI) { // TODO: Add your command update UI handler code here MessageBox("右键弹出菜单测试!"); } void CCMenuView::OnRButt

MUI组件三:列表、遮罩蒙版、数字输入框、侧滑导航和弹出菜单

1.list(列表) 列表是常用的UI控件,mui封装的列表组件比较简单,只需要在ul节点上添加.mui-table-view类.在li节点上添加.mui-table-view-cell类即可,如下为示例代码 <ul class="mui-table-view"> <li class="mui-table-view-cell">Item 1</li> <li class="mui-table-view-cell&q

UIWebView长按弹出菜单显示英文解决办法

UIWebView加载网页后,长按弹出菜单,显示如下英文菜单样式: 在Info.plist中添加CFBundleLocalizations字段,并增加zh_CN元素,即可将上述菜单显示为中文. UIWebView长按弹出菜单显示英文解决办法

隐藏在左侧的jquery弹性弹出菜单

隐藏在左侧的弹性弹出菜单,从淘宝扣下来的,也可作为JAvaScript缓冲动画的典型教程.本弹性菜单可扩展性强,实际上不光可以做成菜单,也可布局一些图文混排的内容或一段视频,总之被弹出的内容是在一段Div内,怎么布置就看你的了. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&qu

糍粑大叔的独游之旅-u3d实现弹出菜单(上)-动态列表

在u3d5.x中,使用ugui作为默认的界面系统,但控件实在太少,很多需求都不能满足,比如弹出菜单(PopupMenu) 我也懒得去网上找现成的实现,再加上现有代码已经有很多有关列表控件的功能,不想再重新动这些代码. 所以自己实现一个,目前先只实现核心.搭建控件相关类的骨干,后期再慢慢丰富和做的更花哨. 开篇之前声明,我的u3d理解非常有限,有很多也许本身自带的功能或有现成库功能我不知道,所以选择了自己探索或实现, 感觉太low欢迎给出好的意见. 定义和代码结构 PopupMenu是点击鼠标或按

web标准(复习)--4 纵向导航菜单及二级弹出菜单

今天我们开始学习纵向导航菜单及二级弹出菜单,包含以下内容和知识点: 纵向列表 标签的默认样式 css派生选择器 css选择器的分组 纵向二级列表 相对定位和绝对定位 一.纵向列表纵向列表或称为纵向导航,在网站的产品列表中应用比较广泛,如淘宝网左侧的淘宝服务,今天我们就学习一下纵向导航的制作 先新建一个页面,然后插入一个ID为menu的div,然后在设计视图中选中文字,点击工具栏的ul图标,即会自动插入ul和li,然后修改文字内容为你需要的内容. <style type="text/css&

IOS实现弹出菜单效果MenuViewController(背景 景深 弹出菜单)

在写项目时,要实现一个从下移上来的一个弹出菜单,并且背景变深的这么一个效果,在此分享给大家. 主要说一下思路及一些核心代码贴出来,要想下载源码, 请到:http://download.csdn.net/download/rhljiayou/6280989 一个简单,效果好,比较实用的菜单弹出效果的实现,效果图: 实现方式:将self.view当前页面缩小,在当前页的上面添加一个菜单的view,即在self.view.superview添加. [cpp] view plaincopy //显示 -