PrimeFaces 3.0 - Как переопределить непрозрачность по умолчанию для наложения диалогов? - PullRequest
Новая
       34

PrimeFaces 3.0 - Как переопределить непрозрачность по умолчанию для наложения диалогов?

2 голосов
/ 28 июня 2011

Я использую PrimeFaces 3.0 и JSF 2.0.В моем веб-приложении я отображаю модальное диалоговое окно на странице, когда браузер пользователя простаивает в течение определенного периода времени, и это вызывает аннулирование сеанса на стороне сервера посредством вызова Ajax.В браузере модальное диалоговое окно отображает простое сообщение о том, что сеанс завершен из-за превышения лимита времени простоя.Все это прекрасно работает (см. Скриншот).

РЕДАКТИРОВАТЬ: обновлено с исправлением "appendToBody"

enter image description here

Вот код с моей страницы Facelet: 

    <p:idleMonitor timeout="#{initParam[clientSideIdleThreshold]}">
        <p:ajax
            event="idle"
            listener="#{logoutBean.idleListener}"
            oncomplete="idleDialog.show()" />
        <p:ajax
            event="active"
            listener="#{logoutBean.activeListener}" />
    </p:idleMonitor>
    <p:dialog
            header="Session Exceeded Idle Limit"
            widgetVar="idleDialog"
            modal="true"
            fixedCenter="true"
            closable="false"
            draggable="false"
            resizable="false"
            appendToBody="true"
            height="200"
            width="400">
        <h:outputText value="Session Terminated" />
    </p:dialog>

Я хочу переопределить непрозрачность по умолчанию для наложения диалогового окна PrimeFaces и сделать его более непрозрачным.Кто-нибудь знает, как это сделать?

Я надеюсь, что это можно сделать, поместив немного CSS в нужное место, потому что я бы действительно хотелось бы избегать написания JavaScript для этого.

Целевыми браузерами для пользовательской среды являются IE 6 и 7.

Ответы [ 2 ]

6 голосов
/ 28 июня 2011

в вашем css: 

.ui-widget-overlay {
    opacity: 0.8;
}

или другое значение:)

Но вы должны быть уверены, что отображаемое вами диалоговое окно является модальным (<p:dialog modal="true"), иначе наложение не будет отображаться.

3 голосов
/ 28 июня 2011

Ответ Fortega был верным для некоторых браузеров, но для IE 7 вам нужно использовать следующий CSS: 

.ui-widget-overlay {
    filter:alpha(opacity=80);  /* works in IE 7 */
    opacity: 0.8;  /* works in Firefox */
}

Согласно www.w3schools.com атрибут CSS непрозрачности равеннестандартный, но предлагается для включения в CSS3.

...