联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > 网页前端技术 > 正文

jquery实现弹出层完美居中效果 - Web前端

作者:98wpeu发布时间:2026-06-10分类:网页前端技术浏览:4


导读:JQuery实现弹出层完美居中效果复制代码代码如下:showDiv($("#pop"));functionshowDiv(obj){ $(obj).show(); center...

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  
 }); 
}

标签:弹出效果完美Webjquery


网页前端技术排行
最近发表
网站分类
标签列表