我在所有視圖中以這種方式顯示對話框:
但它們顯示在頁面底部
我使用CSS在所有對話框中進行了此更改:
.ui-dialog {
position: absolute;
}
.disable-scroll .ui-dialog-content {
overflow: hidden;
width: auto;
}
它們沒有顯示在螢幕頂部?
編輯:
我删除了CSS樣式,但對話框仍然出現在iPad的頁面底部.明天我将在Mac OS X的safari中進行測試
這是我的styles.css檔案:
td.right {
text-align: right;
}
td.center {
text-align: center;
}
table td,table tr {
vertical-align: top;
}
.ui-datatable .ui-datatable-data tr,.ui-datatable .ui-datatable-data-empty tr,.ui-datatable .ui-datatable-data td,.ui-datatable .ui-datatable-data-empty td
{
border-color: #C1DFFA;
}
.odd-row {
background: #ECF5FE;
}
.ui-panelgrid tr,.ui-panelgrid td {
border: none;
}
.ui-panelgrid td {
padding: 2px;
}
.panelgrid-center {
margin: 0 auto !important;
}
.ui-inputfield.uppercased {
text-transform: uppercase;
}
.ui-inputfield {
text-transform: uppercase;
}
.ui-inputfield.no-uppercased {
text-transform: none;
}
.ui-selectonemenu {
width: 144px !important;
}
.ui-selectonemenu-label {
font-size: 95%;
width: 100% !important;
}
.ui-selectonemenu-panel .ui-selectonemenu-list-item {
font-size: 95%;
overflow-x: hidden;
}
.ui-inputtext {
width: 137px !important;
}
.ui-widget {
font-size: 70%;
}
.ui-panel {
float: left;
}
.ui-outputlabel-rfi {
color: red;
}
.ui-outputlabel {
font-weight: bold;
}
.ui-menubar {
background: #C1DFFA;
}
.ui-panel .ui-panel-content {
padding: 0;
}
.ui-datatable thead th,.ui-datatable tbody td,.ui-datatable tfoot td {
padding: 2px;
}
.justify-text {
text-align: justify !important;
}
.negative-number {
color: red;
}
.small-icon {
height: 15px;
width: 15px;
}
.small-inputtext {
width: 80px !important;
}
.full-width {
width: 100%;
}
我的模闆檔案:
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:o="http://omnifaces.org/ui" xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
type="image/x-icon" />
$(document).ready(
function() {
$("div[role='tabpanel']").attr("aria-hidden", "false").attr(
"style", "display: block");
$("h3[role='tab']").removeClass("ui-corner-all").addClass(
"ui-corner-top ui-state-active").find("span").attr(
"class", "ui-icon ui-icon-triangle-1-s");
});
...
... Here is located the application menu ...
視圖示例:
/p>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:o="http://omnifaces.org/ui"
xmlns:of="http://omnifaces.org/functions"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/WEB-INF/templates/main_template.xhtml">
... Body components ...
header="Find products" id="products"
modal="true" position="top" widgetVar="productsWV">
... Dialog components ...
Chrome在視圖内容之前保留了對話框的空間:
上次編輯(找到錯誤)
添加styles.css檔案後,我有以下代碼安靜:
onstart="loadingDialog.show()" onsuccess="loadingDLG.hide()">
resizable="false" showHeader="false" styleClass="disable-scroll"
widgetVar="loadingDialog">
如果我從模闆中删除它,視圖和對話框将完美顯示.我不知道如何把它放在模闆中,因為我需要它