【原创】相对完美的垂直居中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下一个版本完成,再继续分享吧.剩下的功 ...
随机推荐
- ArcSDE解除图层锁定
SDE数据库用来共享.交互数据,比较好用,但经常被B/S那边锁定图层 ,导致不能编辑图层. 查看锁定是谁锁定了用户的命令: sdemon -o info -I users -i esri_sde 解决 ...
- JS代码和OC代码的相互调用
JS调用OC 很多应用里面或多或少的调用了网页,来达到绚丽的效果,所谓的JS调用OC.....举个例子吧,网页上有个按钮 点击按钮跳转界面,跳转的动作由OC的代码实现. OC调用JS 还是举个例子,我 ...
- tabbarItem字体及图片颜色设置
tabbarItem设置图片后运行往往与我们原始图片颜色有出入,这是因为在默认情况下,未选中状态图片和字体颜色为灰色,选中状态下图片和字体颜色为蓝色. UIImage 在呈现(render)时会选 ...
- Android高效计算——RenderScript(一)
高效计算——RenderScript RenderScript是安卓平台上很受谷歌推荐的一个高效计算平台,它能够自动把计算任务分配到各个可用的计算核心上,包括CPU,GPU以及DSP等,提供十分高效的 ...
- html经验汇总
1.点击radio的文字时,自动选中.可以在input里放置label,然后for属性关联input的id <input type="radio" id="male ...
- hive load数据为null
建表语句: CREATE EXTERNAL TABLE IF NOT EXISTS student2 > (sno INT,sname STRING,age INT,sex STRING) &g ...
- .NET应用架构设计—工作单元模式(摆脱过程式代码的重要思想,代替DDD实现轻量级业务)
阅读目录: 1.背景介绍 2.过程式代码的真正困境 3.工作单元模式的简单示例 4.总结 1.背景介绍 一直都在谈论面向对象开发,但是开发企业应用系统时,使用面向对象开发最大的问题就是在于,多个对象之 ...
- jar命令的用法详解
本文详细讲述了JAR命令的用法,对于大家学习和总结jar命令的使用有一定的帮助作用.具体如下: JAR包是Java中所特有一种压缩文档,其实大家就可以把它理解为.zip包.当然也是有区别的,JAR包中 ...
- android 项目中出现红色感叹号的解决方法
问题原因]:工程中classpath中指向的包路径错误 [解决办法]:右键项目名称 BuildPath ---> Configure Build Paht...中,然后上面有几个选项卡找到 Li ...
- Junit测试Controller(MockMVC使用),传输@RequestBody数据解决办法
一.单元测试的目的 简单来说就是在我们增加或者改动一些代码以后对所有逻辑的一个检测,尤其是在我们后期修改后(不论是增加新功能,修改bug),都可以做到重新测试的工作.以减少我们在发布的时候出现更过甚至 ...