【原创】相对完美的垂直居中popup(modal/dialog),无需监听window.resize事件
<table class="popup" style="position: absolute; background-color: black; border-radius: 10px; top: 50%; left: 50%;">
<tr>
<td>
<div>
<textarea style="margin:10px; background-color:azure; height:150px;width:100px;" contenteditable="true"></textarea>
</div>
</td>
</tr>
</table>
$(function () {
var $popup = $('.popup');
$popup.css({marginLeft: $popup.width() / 2 * -1 + 'px', marginTop: $popup.height() / 2 * -1 + 'px' });
});
使用table的目的是,模拟弹窗的高度会根据弹窗的内容高度显示。
【原创】相对完美的垂直居中popup(modal/dialog),无需监听window.resize事件的更多相关文章
- 安卓奇葩问题之:返回按键监听,使Dialog不消失
本文出处:http://bbs.9ria.com/thread-204406-1-1.html 在做自动更新的时候,弹出Dialog提示,要求是只能点击更新或者取消更新时Dialog才会消失.但是在这 ...
- SharePoint 2010 Modal Dialog
SharePoint 2010 Modal Dialog Tweet Modal dialog play very important role to improve the user exper ...
- Create Custom Modal Dialog Windows For User Input In Oracle Forms
An example is given below to how to create a modal dialog window in Oracle Forms for asking user inp ...
- iframe中的jquery ui modal dialog 覆盖父窗口
在iframe中 使用jquery ui dialog,弹出后可以覆盖父窗体 ///iframe中的jquery ui modal dialog 覆盖父窗口 function openDialog() ...
- wxPython Modal Dialog 模式对话框
<wxPython in Action>chap 9 笔记 1. Modal Dialog(模式对话框) A modal dialog blocks other widgets from ...
- Create Dynamic Modal Dialog Form in AdminLTE Bootstrap template
原文地址 Create modal dialog form in jquery using bootstrap framework, slightly different from the usual ...
- Issue 5158: Modal dialog present (UnexpectedAlertOpen) issue in IE (Similar issue like 3360)
https://code.google.com/p/selenium/issues/detail?id=5158 Reported by mailtopa...@gmail.com, Feb 13 ...
- jQuery BlockUI Plugin Demo 5(Simple Modal Dialog Example)
Simple Modal Dialog Example This page demonstrates how to display a simple modal dialog. The button ...
- VUE实现Studio管理后台(完结):标签式输入、名值对输入、对话框(modal dialog)
一周的时间,几乎每天都要工作十几个小时,敲代码+写作文,界面原型算是完成了,下一步是写内核的HTML处理引擎,纯JS实现.本次实战展示告一段落,等RXEditor下一个版本完成,再继续分享吧.剩下的功 ...
随机推荐
- 列表屏幕(List Screen)
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- AJAX初探,XMLHttpRequest介绍
AJAX初探,XMLHttpRequest介绍 AJAX AJAX = Asynchronous JavaScript and XML. 异步的JavaScript和XML. AJ ...
- 全文检索引擎 Solr 部署与基本原理
全文检索引擎 Solr 部署与基本原理 搜索引擎Solr环境搭建实例 关于 solr , schema.xml 的配置说明 全文检索引擎Solr系列-–全文检索基本原理 一.搜索引擎Solr环境搭建实 ...
- 了解HTML 元素分类
HTML中包含大量的标签, 这些标签在我们使用中发现会有小小的差别, 有的标签用了之后不会有太大的布局变化, 只是语义化, 而有的标签却会重起一行, 相当于自己回车了一次, 这就是不同标签元素的分类不 ...
- OC NSFileHandle(文件内容操作)
OC NSFileHandle(文件内容操作) 初始化 [NSFileHandle fileHandleForUpdatingAtPath:@"data.txt"]; //file ...
- scrollWidth,clientWidth,offsetWidth的区别
通过一个demo测试这三个属性的差别. 说明: scrollWidth:对象的实际内容的宽度,不包边线宽度,会随对象中内容超过可视区后而变大. clientWidth:对象内容的可视区的宽度,不包 ...
- ComboBox(下拉列表框)实现省、市、县三级联动,用hibernate连接数据库
package com.hanqi.web; import java.io.IOException; import java.util.List; import javax.servlet.Servl ...
- HDFS Federation (读书笔记)
HDFS Federation (读书笔记) HDFS的架构 HDFS包含两个层次:命名空间管理(Namespace) 和 块/存储管理(Block Storage). 命名空间管理(Namespac ...
- linux常用系统监控命令
原文:http://blog.sina.com.cn/s/blog_68f1c17001016uvy.html Linux提供了很多用于监控系统的工具,使用这些工具可以找到导致系统性能降低的瓶颈.系统 ...
- 关于Web报表FineReport打印的开发应用案例
报表打印是报表使用和开发过程中经常碰到的问题,这里汇总了关于Web报表开发打印功能的一些典型应用案例,以应用最广泛的FineReport为例. 案例一:java直接调用报表打印 当java后台定义定时 ...