将jquery对话框弹出对齐到IE和Firefox中的屏幕中心

时间:2022-11-18 17:26:22

There is my code so far. The issue is that the popup seems to be working perfect in Chrome but in Firefox it sticks to the top of the window after entering and in IE the popup does not even appear.

到目前为止我的代码。问题是,弹出窗口似乎在Chrome中运行得很完美,但在Firefox中,它在进入后会粘在窗口的顶部,而在IE中,弹出窗口甚至不会出现。

<html>
<head>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.10.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>


</head>
<body>

<div id="dialog" title="My Dialog Title" style="display:none">
    <p>This is My Dialog box Description/Content</p>   

</div>

<script type="text/javascript">

    $(document).ready(function() {    
    setTimeout(function(){
      $(function () {
        $("#dialog").dialog({
            show: {
            effect: 'drop',
            direction : 'up',
            distance: 1000,
            duration: 2000,
            },
        });
      });
    }, 2000)
});


</script>

<style>
.ui-dialog-titlebar {display:none;}
#other_content {width:200px; height:200px;background-color:grey;}
#dialog_content{display:none;}
</style>

</body>
</html>

I want the popup to behave in the same manner as it is in Chrome with all the browsers.

我希望弹出窗口的行为方式与使用所有浏览器的Chrome一样。

http://jsfiddle.net/fakhruddin/x39Rr/14/

http://jsfiddle.net/fakhruddin/x39Rr/14/

Web Page Link

网页链接

Please guide.

请指导。

2 个解决方案

#1


2  

Try to add:

尝试添加:

<body style="height:100%">

#2


1  

The solution is simple! Add to the begin of file:

解决方案很简单!添加到文件的开头:

<!DOCTYPE HTML>

#1


2  

Try to add:

尝试添加:

<body style="height:100%">

#2


1  

The solution is simple! Add to the begin of file:

解决方案很简单!添加到文件的开头:

<!DOCTYPE HTML>