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 相关文章推荐
ExtJS 2.0 GridPanel基本表格简明教程
May 25 Javascript
一些javascript一些题目的解析
Dec 25 Javascript
JQuery为textarea添加maxlength属性并且兼容IE
Apr 25 Javascript
常用的几段javascript代码分享
Mar 25 Javascript
javascript的日期对象、数组对象、二维数组使用说明
Dec 22 Javascript
基于javascript实现全国省市二级联动下拉选择菜单
Jan 28 Javascript
JS+jQuery实现注册信息的验证功能
Sep 26 jQuery
基于Two.js实现星球环绕动画效果的示例
Nov 06 Javascript
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
Aug 27 Javascript
countUp.js实现数字滚动效果
Oct 18 Javascript
解决vue页面渲染但dom没渲染的操作
Jul 27 Javascript
JS实现按比例缩小图片宽高
Aug 24 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
2006/11/25 PHP
PHP中实现汉字转区位码应用源码实例解析
2010/06/14 PHP
openflashchart 2.0 简单案例php版
2012/05/21 PHP
破解.net程序(dll文件)编译和反编译方法
2013/01/31 PHP
PHP 线程安全与非线程安全版本的区别深入解析
2013/08/06 PHP
浅谈PHP的$_SERVER[SERVER_NAME]
2017/02/04 PHP
php lcg_value与mt_rand生成0~1随机小数的效果对比分析
2017/04/05 PHP
jquery each()源代码
2011/02/14 Javascript
控制input输入框中提示信息的显示和隐藏的方法
2014/02/12 Javascript
JavaScript参数个数可变的函数举例说明
2014/10/10 Javascript
jQuery实现下拉框选择图片功能实例
2015/08/08 Javascript
深入浅析Extjs中store分组功能的使用方法
2016/04/20 Javascript
jQuery Easyui datagrid/treegrid 清空数据
2016/07/09 Javascript
jQuery实现删除li节点的方法
2016/12/06 Javascript
bootstrap modal弹出框的垂直居中
2016/12/14 Javascript
js实现文本上下来回滚动
2017/02/03 Javascript
vue中路由验证和相应拦截的使用详解
2017/12/13 Javascript
JS字符串常用操作方法实例小结
2019/06/24 Javascript
微信小程序如何调用新闻接口实现列表循环
2019/07/02 Javascript
JS实现按比例缩小图片宽高
2020/08/24 Javascript
vue-openlayers实现地图坐标弹框效果
2020/09/24 Javascript
python通过apply使用元祖和列表调用函数实例
2015/05/26 Python
Python正则表达式完全指南
2017/05/25 Python
linux环境下python中MySQLdb模块的安装方法
2017/06/16 Python
python执行CMD指令,并获取返回的方法
2018/12/19 Python
对python3 Serial 串口助手的接收读取数据方法详解
2019/06/12 Python
Python爬虫程序架构和运行流程原理解析
2020/03/09 Python
python3.x中安装web.py步骤方法
2020/06/23 Python
写clone()方法时,通常都有一行代码,是什么?
2012/10/31 面试题
鲜果饮品店创业计划书
2014/01/21 职场文书
安全生产中长期规划实施方案
2014/02/21 职场文书
学生党员的自我评价范文
2014/03/01 职场文书
四风问题对照检查材料思想汇报
2014/10/07 职场文书
2015年民兵整组工作总结
2015/07/24 职场文书
mongodb清除连接和日志的正确方法分享
2021/09/15 MongoDB
mysql函数全面总结
2021/11/11 MySQL