Jquery模式对话框弹出-固定在所有浏览器的屏幕中心
Jquery模式对话框弹出-固定在所有浏览器的屏幕中心
提问于 2015-11-18 21:32:11
我需要在页面加载时显示弹出窗口。我正在得到弹出窗口，但问题是弹出对话框出现在IE屏幕的中心。但在firefox和chrome中，它看起来稍微向下(即:它位于屏幕的中心-页面太长)。但我希望它留在火狐和chrome的屏幕中央。
请在chrome中尝试。
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script>
$(function() {
$( "#dialog" ).dialog({
width : 710,
height : 410,
modal: true
});
});
</script><link rel="stylesheet" href="https://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<style>
.ui-dialog-titlebar {
height: 15px;
}
</style><!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
</head>
<body>
<div id="dialog" style="display:none;" title=" ">
<iframe frameborder="0" scrolling="no" width="670" height="350" src="popUp.html"></iframe>
</div>
</body>
</html>
回答 1
Stack Overflow用户
发布于 2015-11-18 22:56:26
试试这段代码
$(function() {
var dlog= $( "#dialog" ).dialog({
width : 710,
height : 350,
modal: true
/*,position:{
my: 'center',
at: 'center',
of:window
} not working I do not know why may be the version of jquery */
});
var objpos = { left: ($(window).width() - $( "#dialog" ).closest('.ui-dialog').width()) / 2, top:(window.innerHeight- $( "#dialog" ).closest('.ui-dialog').height())/2 }
//$( ".ui-dialog" ).dialog('option', 'position', [objpos.left, objpos.top]); not working I do not know why may be the version of jquery
$( "#dialog" ).closest('.ui-dialog').css({ top: objpos.top+ 'px',left:objpos.left+"px" });
}); .ui-dialog-titlebar {
height: 15px;
} <link rel="stylesheet" href="https://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
</head>
<body>
<div id="dialog" style="display:none;" title=" ">
<iframe frameborder="0" scrolling="no" width="670" height="350" src="popUp.html"></iframe>
</div>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33781440
复制相关文章
相似问题
腾讯云开发者
