思路：

　　1.獲取當前頁面的高和寬、針對頂部和左側的滑動距離。

　　2.將彈出框的位置設為絕對位置。

????? 3.設置彈出框針對屏幕的左側和頂部的距離。

代碼：

html ：

　　 <div class="dialog">

　　　......?? //模態框內容　　?

　　 </div>

css: .dialog{ position:abosulte;......}

script: var showDialog(){

　　var objW = $(window);

　　var objC = $(".dialog");

　　var brsW = objW.width();

　　var brsH = objW.height();

　　var sclL = objW.scrollLeft();

　　var sclT = objW.scrollTop();

　　var curW = objC.width();

　　var curH = objC.height();

　　var left = scrlL + (brsW - curW)/2;

　　var top = scrlT + (brsH - curH)/2;

　　objC.css("left":left,"top":top);

}

ps:$(window).resize(function(){//頁面窗口大小改變事件

　　showDialog();

});

轉載于:https://www.cnblogs.com/hjlblog/p/5626533.html

總結

以上是生活随笔為你收集整理的弹出框设置在页面居中的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。