jquery实现弹出层完美居中效果


Posted in Javascript onMarch 03, 2014

jquery实现弹出层完美居中效果

showDiv($("#pop"));
function showDiv(obj){
 $(obj).show();
 center(obj);
 $(window).scroll(function(){
  center(obj);
 });
 $(window).resize(function(){
  center(obj);
 }); 
}
function center(obj){
 var windowWidth = document.documentElement.clientWidth;   
 var windowHeight = document.documentElement.clientHeight;   
 var popupHeight = $(obj).height();   
 var popupWidth = $(obj).width();    
 $(obj).css({   
  "position": "absolute",   
  "top": (windowHeight-popupHeight)/2+$(document).scrollTop(),   
  "left": (windowWidth-popupWidth)/2   
 });  
}
Javascript 相关文章推荐
在第一个input框内输入内容.textarea自动得到第一个文件框的值的javascript代码
Apr 20 Javascript
将查询条件的input、select清空
Jan 14 Javascript
javascript避免数字计算精度误差的方法详解
Mar 05 Javascript
JavaScript实现生成GUID(全局统一标识符)
Sep 05 Javascript
JavaScript变量声明详解
Nov 27 Javascript
总结JavaScript中布尔操作符||与&&的使用技巧
Nov 17 Javascript
基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法
Jul 22 Javascript
Bootstrap Validator 表单验证
Jul 25 Javascript
在js代码拼接dom对象到页面上去的模板总结(必看)
Feb 14 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
Jan 18 Javascript
微信小程序实现团购或秒杀批量倒计时
Nov 01 Javascript
详解element-ui中表单验证的三种方式
Sep 18 Javascript
jquery实现弹出层遮罩效果的简单实例
Mar 03 #Javascript
SeaJS入门教程系列之使用SeaJS(二)
Mar 03 #Javascript
Jquery.Form 异步提交表单的简单实例
Mar 03 #Javascript
jquery实现ajax提交form表单的方法总结
Mar 03 #Javascript
SeaJS入门教程系列之SeaJS介绍(一)
Mar 03 #Javascript
js的hasownproperty使用示例
Mar 02 #Javascript
javascript对象的使用和属性操作示例详解
Mar 02 #Javascript
You might like
php session应用实例 登录验证
2009/03/16 PHP
php 中的4种标记风格介绍
2012/05/10 PHP
浅析Yii中使用RBAC的完全指南(用户角色权限控制)
2013/06/20 PHP
Smarty日期时间操作方法示例
2016/11/15 PHP
js修改input的type属性及浏览器兼容问题探讨与解决
2013/01/23 Javascript
jQuery中$.fn的用法示例介绍
2013/11/05 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
页面装载js及性能分析方法介绍
2014/03/21 Javascript
使用jquery.qrcode生成彩色二维码实例
2014/08/08 Javascript
Egret引擎开发指南之运行项目
2014/09/03 Javascript
JavaScript实现复制文章自动添加版权
2016/08/02 Javascript
Vue input控件通过value绑定动态属性及修饰符的方法
2017/05/03 Javascript
通过命令行创建vue项目的方法
2017/07/20 Javascript
vue.js项目nginx部署教程
2018/04/05 Javascript
Angular CLI在Angular项目中如何使用scss详解
2018/04/10 Javascript
JS使用Dijkstra算法求解最短路径
2019/01/17 Javascript
js判断非127开头的IP地址的实例代码
2020/01/05 Javascript
JS中箭头函数与this的写法和理解
2021/01/14 Javascript
ReactRouter的实现方法
2021/01/25 Javascript
Python列表计数及插入实例
2014/12/17 Python
python getopt详解及简单实例
2016/12/30 Python
Django的信号机制详解
2017/05/05 Python
解决Python selenium get页面很慢时的问题
2019/01/30 Python
TensorFlow tf.nn.conv2d实现卷积的方式
2020/01/03 Python
django模板获取list中指定索引的值方式
2020/05/14 Python
Python调用C/C++的方法解析
2020/08/05 Python
解决H5的a标签的download属性下载service上的文件出现跨域问题
2019/07/16 HTML / CSS
基于html5 canvas实现漫天飞雪效果实例
2014/09/10 HTML / CSS
百联网上商城:i百联
2017/01/28 全球购物
寻找完美的房车租赁:RVShare
2019/02/23 全球购物
STAUD官方网站:洛杉矶独有的闲适风格
2019/04/11 全球购物
介绍一下except的用法和作用
2015/01/22 面试题
DELPHI中如何调用API,可举例说明
2014/01/16 面试题
春季运动会广播稿大全
2014/02/19 职场文书
幼儿园开学家长寄语(2016秋季)
2015/12/03 职场文书