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 相关文章推荐
IE8 浏览器Cookie的处理
Jan 31 Javascript
实用的JS正则表达式(手机号码/IP正则/邮编正则/电话等)
Jan 11 Javascript
鼠标放在图片上显示大图的JS代码
Mar 26 Javascript
Bootstrap 源代码分析(未完待续)
Aug 17 Javascript
原生JavaScript制作计算器
Oct 16 Javascript
vue-router重定向不刷新问题的解决
Jun 25 Javascript
Vue动态获取width的方法
Aug 22 Javascript
详解npm 配置项registry修改为淘宝镜像
Sep 07 Javascript
element ui table(表格)实现点击一行展开功能
Dec 04 Javascript
编写更好的JavaScript条件式和匹配条件的技巧(小结)
Jun 27 Javascript
Javascript实现鼠标点击冒泡特效
Dec 24 Javascript
原生js+canvas实现贪吃蛇效果
Aug 02 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
windows下升级PHP到5.3.3的过程及注意事项
2010/10/12 PHP
php文件系统处理方法小结
2016/05/23 PHP
PHP array_shift()用法实例分析
2019/01/07 PHP
基于JQuery模仿苹果桌面的Dock效果(初级版)
2012/10/15 Javascript
jquery异步跨域访问代码
2013/06/28 Javascript
浅析javascript中的事件代理
2015/11/06 Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
2016/06/20 Javascript
bootstrap timepicker在angular中取值并转化为时间戳
2017/06/13 Javascript
基于vue.js路由参数的实例讲解——简单易懂
2017/09/07 Javascript
vue源码解析之事件机制原理
2018/04/21 Javascript
vue中$refs的用法及作用详解
2018/04/24 Javascript
VUE简单的定时器实时刷新的实现方法
2019/01/20 Javascript
浅谈javascript中的prototype和__proto__的理解
2019/04/07 Javascript
pymssql ntext字段调用问题解决方法
2008/12/17 Python
windows下安装Python和pip终极图文教程
2017/03/05 Python
Python实现string字符串连接的方法总结【8种方式】
2018/07/06 Python
python实现飞机大战小游戏
2019/11/08 Python
Python使用Turtle库绘制一棵西兰花
2019/11/23 Python
python的slice notation的特殊用法详解
2019/12/27 Python
django-xadmin根据当前登录用户动态设置表单字段默认值方式
2020/03/13 Python
python3.7调试的实例方法
2020/07/21 Python
python 爬虫基本使用——统计杭电oj题目正确率并排序
2020/10/26 Python
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
毕业生的自我鉴定该怎么写
2013/12/02 职场文书
好习惯伴我成长演讲稿
2014/05/21 职场文书
财务管理专业自荐书
2014/09/02 职场文书
财务助理岗位职责范本
2014/10/09 职场文书
优秀班主任推荐材料
2014/12/17 职场文书
优秀教研组申报材料
2014/12/26 职场文书
维稳承诺书
2015/01/20 职场文书
女性健康知识讲座主持词
2015/07/04 职场文书
晚会开幕词范文
2016/03/04 职场文书
导游词之山西-五老峰
2019/10/07 职场文书
浅谈Mysql多表连接查询的执行细节
2021/04/24 MySQL
Python编写nmap扫描工具
2021/07/21 Python
JS前端轻量fabric.js系列物体基类
2022/08/05 Javascript