如果对话框的父级具有固定位置，则jQuery模式对话框被overlay div隐藏
||
我的jQuery对话框之一是在具有固定位置（页面的页脚）的div中定义的。当打开模态jQuery对话框时，jQuery创建一个覆盖整个页面的覆盖div，然后将要打开的对话框放在z-index值高于覆盖div的顶部。不幸的是，尽管要打开的模态对话框的z索引大于覆盖层本身，但在div中具有固定位置的任何对话框都将被覆盖div覆盖。
为了演示目的，我简化了以下HTML代码，以显示非固定位置div和固定位置div中的对话框之间的区别：
<?xml version=\"1.0\" encoding=\"UTF-8\"?>
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<link type=\"text/css\" rel=\"stylesheet\" href=\"/demo-webapp/faces/javax.faces.resource/themes/sam/theme.css?ln=primefaces&amp;v=2.2.1\" />
<link type=\"text/css\" rel=\"stylesheet\" href=\"/demo-webapp/faces/javax.faces.resource/jquery/ui/jquery-ui.css?ln=primefaces&v=2.2.1\" />
<title>CSS TEST</title><script type=\"text/javascript\" src=\"/demo-webapp/faces/javax.faces.resource/jquery/jquery.js?ln=primefaces&v=2.2.1\"></script><script type=\"text/javascript\" src=\"/demo-webapp/faces/javax.faces.resource/jquery/ui/jquery-ui.js?ln=primefaces&v=2.2.1\"></script>
<script>
/*<![CDATA[*/
jQuery(function() {
jQuery(\"#dialog1\").dialog({
autoOpen: false,
modal: true
});
jQuery(\"#dialog2\").dialog({
autoOpen: false,
modal: true
});
});
/*]]>*/
</script>
</head>
<body>
<div style=\"z-index: 1; position: static;\" onclick=\"jQuery(\'#dialog1\').dialog(\'open\')\">
position: static; /* default */
<div id=\"dialog1\" title=\"Dialog1\"></div>
</div>
<div style=\"z-index: 1; position: fixed; left: 100px; top: 100px\" onclick=\"jQuery(\'#dialog2\').dialog(\'open\')\">
position: fixed;
<div id=\"dialog2\" title=\"Dialog2\"></div>
</div>
</body>
</html>
没有找到相关结果
已邀请:
2 个回复
坝镰补翔奋
.ui-widget-overlay{ position:fixed; }盟犯涩沟都
<script> /* Bug fix that moves every dialog directly into the body tag since some jQueryUI dialogs are sometimes not placed above the overlay div due to their parent divs */ $(document).ready(function() { var body = $(\"html body\")[0]; $(\"div.ui-dialog\").each(function() { $(this).appendTo(body); }); }); </script>标记，因为这些div gt动态地注入了类。因此，此错误修复程序必须在之后执行。