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 相关文章推荐
一个不错的用JavaScript实现的UBB编码函数
Mar 09 Javascript
通过继承IHttpHandle实现JS插件的组织与管理
Jul 13 Javascript
Javascript WebSocket使用实例介绍(简明入门教程)
Apr 16 Javascript
探讨JavaScript中的Rest参数和参数默认值
Jul 29 Javascript
微信web端后退强制刷新功能的实现代码
Mar 04 Javascript
Vue不能观察到数组length的变化
Jun 08 Javascript
vue中使用protobuf的过程记录
Oct 26 Javascript
JS实现的图片选择顺序切换和循环切换功能示例【测试可用】
Dec 28 Javascript
vue实现form表单与table表格的数据关联功能示例
Jan 29 Javascript
使用localStorage替代cookie做本地存储
Sep 25 Javascript
js new Date()实例测试
Oct 31 Javascript
基于 Vue 的 Electron 项目搭建过程图文详解
Jul 22 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的输入输出流
2007/02/14 PHP
11个PHP 分页脚本推荐
2011/08/15 PHP
php通过ajax实现双击table修改内容
2014/04/28 PHP
ASP和PHP实现生成网站快捷方式并下载到桌面的方法
2014/05/08 PHP
php制作动态随机验证码
2015/02/12 PHP
PHP使用curl函数发送Post请求的注意事项
2016/11/26 PHP
PHP合并数组函数array_merge用法分析
2017/02/17 PHP
详细对比php中类继承和接口继承
2018/10/11 PHP
PHP日期和时间函数的使用示例详解
2020/08/06 PHP
js输出列表实现代码
2010/09/12 Javascript
基于promise.js实现nodejs的promises库
2014/07/06 NodeJs
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
JavaScript判断一个字符串是否包含指定子字符串的方法
2015/03/18 Javascript
javascript中if和switch,==和===详解
2015/07/30 Javascript
详解用Node.js实现Restful风格webservice
2017/09/29 Javascript
js Element Traversal规范中的元素遍历方法
2018/04/19 Javascript
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
2018/09/27 Javascript
vue实现条件判断动态绑定样式的方法
2018/09/29 Javascript
怎么使用javascript深度拷贝一个数组
2019/06/06 Javascript
Vue v-for循环之@click点击事件获取元素示例
2019/11/09 Javascript
[03:24]CDEC.Y赛前采访 努力备战2016国际邀请赛中国区预选赛
2016/06/25 DOTA
[47:52]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第二场 11.26
2020/11/30 DOTA
Python文件右键找不到IDLE打开项解决办法
2015/06/08 Python
VSCode中自动为Python文件添加头部注释
2019/11/14 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
Django使用rest_framework写出API
2020/05/21 Python
解决Keras 自定义层时遇到版本的问题
2020/06/16 Python
详解pytorch tensor和ndarray转换相关总结
2020/09/03 Python
用HTML5制作一个简单的弹力球游戏
2015/05/12 HTML / CSS
汉森冲浪板:Hansen Surfboards
2018/05/19 全球购物
俄罗斯电子产品在线商店:UltraTrade
2020/01/30 全球购物
课外访万家心得体会
2014/09/03 职场文书
群众路线对照检查材料思想汇报怎么写
2014/09/18 职场文书
医药公司开票员岗位职责
2015/04/15 职场文书
选对餐饮营销策略,营业额才会上涨
2019/08/27 职场文书
一文弄懂MySQL索引创建原则
2022/02/28 MySQL