文档章节

小黑小波比.解决模态框遮罩层问题

BobbyLou
 BobbyLou
发布于 2015/05/14 16:03
字数 241
阅读 9
收藏 0

Client/Views/Admin/person.tpl

1.在html上,添加点击按钮,官方的按钮,是调用了内部的遮罩层。所以这里,我们要自己调用自己的遮罩层。

<a on="btnCerti" >点击这里</a>

2.在html上,添加div模态框,这里的模态框添加了<div>作为自己的遮罩层。

<div class="modal fade" id="myModal"  style="display:none;">
							<div style="
							    position: absolute;
							    top: 0;
							    bottom: 0;
							    width: 100%;
							    opacity: 0.5;
							    background-color: #000000;
							"></div>
							  <div class="modal-dialog" style="margin-top:500px;margin-left:700px;">
							    <div class="modal-content">
							      <div class="modal-header">
							        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
							        <h4 class="modal-title">提示</h4>
							      </div>
							      <div class="modal-body">
							        <p>您要取消认证申请吗?…</p>
							      </div>
							      <div class="modal-footer">
							        <button type="button" class="btn btn-default" data-dismiss="modal" on="btnPer">取消</button>
							        <button type="button" class="btn btn-primary" on="btnCancellicense">确定</button>
							      </div>
							    </div><!-- /.modal-content -->
							  </div><!-- /.modal-dialog -->
							</div>


Client/Scripts/GUI/Admin/person.js
3.在客户端中,添加弹出模态框事件

btnCerti:function(sender,arg){
		_('#myModal').show();
		_('#myModal').css("opacity","1");
	},


效果如图:


本文转载自:http://blog.csdn.net/u010489586/article/details/39989971

BobbyLou
粉丝 8
博文 149
码字总数 5825
作品 0
海淀
程序员
私信 提问
bootstrap模态框hide遮罩层不隐藏解决办法

问题:在使用ajax提交模态框表单数据后,隐藏模态框并局部刷新,导致遮罩层不消失 原因:模态框隐藏并局部刷新,导致在hide方法没执行完成时已经局部刷新,没有隐藏掉遮罩层 解决办法: 方法...

dongfeng012
2018/05/16
0
0
BootStrap 模态框点击遮罩层禁止关闭

下面是代码部分 显示模态框,false不显示模态框 禁止遮罩层的点击关闭 禁止键盘ESC

Deacyn
2015/09/24
1K
0
v-dialogs v1.10 发布,基于 Vue2 的多功能弹出窗口组件

基于 Vue2 的多功能弹出窗口组件 v1.10.0 版本发布,更新内容: 修复连续弹出和关闭窗口时,最后一个窗口不会被关闭的问题 窗口增加部分动画效果 增加 singletonKey 配置项目,用于设置全局唯...

TerryZ
2018/06/08
1K
1
HTML 应用 遮罩

遮罩的应用太多了,这里会分析一下 bootstrap 模态框 实现方式 示例看这里:http://v3.bootcss.com/javascript/#modals fixed的布局 fixed 半透明背景 relative 的内容区域 为了防止body的滚...

HonChy
2014/12/20
35
0
混子前端在开发公众号嵌套webview遇到的常见问题

相信很多前端伙伴在开发手机端总会遇到这样那样的一些兼容坑,无论是在开发微信小程序 公众号嵌套webview 还是原生内嵌App,那混子前端之前在开发公众号嵌套webview 时遇到了几个常见问题,在...

Terrence Lu
06/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

uni app 零基础小白到项目实战

$emit 子组件传给父组件$ref 父组件操作子组件 公用模板 uni-app全局变量的几种实现方法 const websiteUrl = 'http'const now = Date.now || function() { return new Date().getTime......

达达前端小酒馆
24分钟前
4
0
Tomcat是如何实现异步Servlet的

前言 通过我之前的Tomcat系列文章,相信看我博客的同学对Tomcat应该有一个比较清晰的了解了,在前几篇博客我们讨论了Tomcat在SpringBoot框架中是如何启动的,讨论了Tomcat的内部组件是如何设...

木木匠
48分钟前
21
0
mysql中间件分享(Mysql-prxoy,Atlas,DBProxy,Amoeba,cobar,TDDL)

hello 各位小伙伴大家好,我是小栈君,这期我们分享关于mysql中间件的研究,也就是数据层的读写分离和负载均衡,希望能够在实际的应用中能够帮助到各位小伙伴。 下期我们将继续分享go语言的系...

IT干货栈
今天
10
0
OSChina 周一乱弹 —— 人生,还真是到处是意外

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @这次装个文艺青年吧 :#今日歌曲推荐# 分享lil peep的单曲《High School》 《High School》- lil peep 手机党少年们想听歌,请使劲儿戳(这里...

小小编辑
今天
843
13
Spring使用ThreadPoolTaskExecutor自定义线程池及实现异步调用

多线程一直是工作或面试过程中的高频知识点,今天给大家分享一下使用 ThreadPoolTaskExecutor 来自定义线程池和实现异步调用多线程。 一、ThreadPoolTaskExecutor 本文采用 Executors 的工厂...

CREATE_17
今天
12
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部