richfaces 3.X를 사용하는 프로젝트가 있습니다.투명 richfaces 모달 패널
사용자가 편집 버튼을 클릭하면 모달 패널이 나타납니다.
이제이 모달 패널이 투명하게 보입니다.
IE 11에서만 발생하며 IE의 다른 버전을 포함한 다른 브라우저에서도 정상적으로 작동합니다.
누구나 그 이유가 무엇인지 압니다.
<rich:modalPanel id="wizardGeneric#{id}" autosized="true" minWidth="#{empty wizardWidth ? 500 : wizardWidth}"
minHeight="#{ empty wizardHight ? (wizard.showNavigation ? 430 : 400) : wizardHight}"
maxHeight="#{empty wizardHight ? 400 : wizardHight}" rendered="#{wizard.modalOpened}"
showWhenRendered="true" styleClass="wizardZIndex wizardGenericPanel"
top = "30" left = "100"
controlsClass = "wizardModalControlClass"
onmove="if(document.selection) document.selection.empty(); else if(window.getSelection) window.getSelection().removeAllRanges();">
<f:facet name="header">
<h:panelGroup styleClass="wizardGenericHeader" id="wizardGenericHeader#{id}" />
</f:facet>
<h:form id="wizardGenericForm#{id}" styleClass="edit wizardGenericFormClass" enctype="multipart/form-data">
<h:panelGrid styleClass="wizardGenericPrevNext" id="wizardGenericPrevNext#{id}" rendered="#{wizard.showNavigation}">
<h:panelGroup>
<a:commandLink
value="#{messages.prevEntry} #{wizard.className}"
rendered="#{wizard.hasPrevious()}"
eventsQueue = "eventsQueue"
action="#{wizard.goToPrevious()}"
reRender="wizardGenericPrevNext#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}"
style="margin-right:15px;" />
<a:commandLink
value="#{messages.nextEntry} #{wizard.className}"
rendered="#{wizard.hasNext()}"
eventsQueue = "eventsQueue"
action="#{wizard.goToNext()}"
reRender="wizardGenericPrevNext#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}" />
</h:panelGroup>
</h:panelGrid>
<s:div styleClass="wizardGenericDescription" id="wizardGenericDescription#{id}">
<h:panelGrid columns="2" id="wizardGenericDescriptionPg#{id}" styleClass="wizardGrid" columnClasses="wizardExclamation,wizardDesc" rendered="#{wizard.showDescription}">
<h:panelGroup>
<h:outputText value="!" />
</h:panelGroup>
<h:panelGroup>
<h:outputText value="#{wizard.aktSite.pageDescription.getText()}"/>
</h:panelGroup>
</h:panelGrid>
</s:div>
<s:div id="wizardGenericFormSDiv#{id}" styleClass="wizardGenericPanelInner" style="display:block;">
<s:div styleClass="wizardIncludedStepContainer" style="height:#{empty wizardHight ? 340 : wizardHight-70}px;margin: 0 0 30px;">
<s:div id="msgWizard#{id}" style="overflow-y:visible;overflow-x:hidden;margin:10px;">
<h:messages id="msgWizardMsg#{id}" styleClass="message"
errorClass="errormsg" infoClass="infomsg" warnClass="warnmsg"
rendered="#{showGlobalMessages != 'false'}" />
</s:div>
<a:include styleClass="includedStepContent" id="includedStepContent#{id}" viewId="#{wizard.aktSite.pageName}"
rendered="#{!empty wizard.aktSite}" />
</s:div>
<h:panelGrid columns="2" id="wizardGenericButtons#{id}" styleClass="wizardBgButtonsBottom" width="100%">
<h:panelGroup styleClass="wizardGenericNavigation" id="wizardGenericNavigation#{id}" style="float:left">
<a:commandButton action="#{wizard.prevStep}" styleClass="wizardButtonsBottom"
eventsQueue="eventsQueue" id="wizardGenericPrev#{id}"
limitToList="true"
disabled="#{!wizard.previous}"
reRender="wizardGenericControls#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}"
bypassUpdates="#{wizard.hasChild()}"
ajaxSingle = "#{wizard.hasChild()}"
immediate = "#{wizard.hasChild()}"
type="button" value="#{msg.back}" />
<rich:spacer width="5px" />
<a:commandButton action="#{wizard.nextStep}" styleClass="wizardButtonsBottom"
eventsQueue="eventsQueue" id="wizardGenericNext#{id}"
limitToList="true"
disabled="#{!wizard.next}"
reRender="wizardGenericControls#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}"
type="button" value="#{msg.next}" />
</h:panelGroup>
<h:panelGroup id="wizardGenericOps#{id}" style="float:right">
<a:outputPanel ajaxRendered="true">
<a:commandButton action="#{wizard.submit}" styleClass="wizardButtonsBottom"
disabled="#{not(wizard.submit)}" eventsQueue="eventsQueue"
id="wizardGenericSubmit#{id}"
reRender="wizardGenericSDiv#{id}, #{reRender}"
rendered="#{empty hideSaveBtn}"
type="button" value="#{empty saveBtn ? msg.save : saveBtn}">
<f:param name = "firstRead" value = "true"/>
</a:commandButton>
<rich:spacer width="5px" />
<a:commandButton styleClass="wizardButtonsBottom"
action="#{wizard.saveAndNew}"
disabled="#{not(wizard.submit)}"
eventsQueue="eventsQueue"
id="wizardGenericSaveAndNew#{id}"
limitToList="true"
reRender="wizardGeneric#{id}, #{reRender}"
rendered="#{empty hideDisableNewBtn}"
type="button"
value="#{empty saveAndNewBtn ? msg.saveAndNew : saveAndNewBtn}">
<f:param name = "firstRead" value = "true"/>
</a:commandButton>
<rich:spacer width="5px" />
</a:outputPanel>
<a:commandButton styleClass="wizardButtonsBottom"
action="#{wizard.reset}" ajaxSingle="true"
bypassUpdates="true" eventsQueue="eventsQueue"
id="wizardGenericReset#{id}"
immediate="true" limitToList="true" reRender="wizardGenericSDiv#{id}, #{renderOnReset}"
type="button" value="#{msg.abbrechen}"
actionListener="#{rich:findComponent('includedStepContent'.concat(id)).getChildren().clear()}"/>
</h:panelGroup>
</h:panelGrid>
<script>
resizetable();
</script>
</s:div>
<rich:panel styleClass="wizardStepsContainer" id="wizardGenericHeaderStepTitle#{id}" bodyClass="wizardSteps">
<c:if test="#{wizard.stepNumbetLast gt 1}">
<c:forEach var="step" begin="1" end="#{empty stepNumbetLast ? wizard.stepNumbetLast : stepNumbetLast}" step="1">
<a:commandLink rendered="#{wizard.isStepActive(step) and step eq (wizard.stepNumbetCurrent-1)}" action="#{wizard.prevStep}" value="#{wizard.stepNumbetCurrent-1}" title="#{wizard.stepName(step)}"
styleClass="stepleft" eventsQueue="eventsQueue"
reRender="wizardGenericControls#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}" />
<a:commandLink rendered="#{wizard.isStepActive(step) and step eq (wizard.stepNumbetCurrent+1)}" action="#{wizard.nextStep}" value="#{wizard.stepNumbetCurrent+1}" title="#{wizard.stepName(step)}"
styleClass="stepright" eventsQueue="eventsQueue" ajaxSingle="#{wizard.hasChild()}"
reRender="wizardGenericControls#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericFormSDiv#{id}" />
<a:commandLink rendered="#{wizard.isStepActive(step) and step != (wizard.stepNumbetCurrent-1) and step != wizard.stepNumbetCurrent and step != (wizard.stepNumbetCurrent+1) and wizard.edit}"
action="#{wizard.goToStep(step)}" value="#{step}" title="#{wizard.stepName(step)}" eventsQueue="eventsQueue" ajaxSingle="#{wizard.hasChild()}"
styleClass="#{(step lt wizard.stepNumbetCurrent ? 'stepleft' : (step gt wizard.stepNumbetCurrent ? 'stepright' : 'stepcurrent'))}"
reRender="wizardGenericControls#{id}, wizardGenericHeaderPageTitle#{id}, wizardGenericHeaderStepTitle#{id}, wizardGenericDescription#{id}, wizardGenericForm#{id}" />
<h:outputText value="#{step}" rendered="#{!wizard.isStepActive(step) or ((step != (wizard.stepNumbetCurrent-1) and step != (wizard.stepNumbetCurrent+1) and !wizard.edit)) or (step eq wizard.stepNumbetCurrent and wizard.edit)}"
styleClass="#{(step lt wizard.stepNumbetCurrent ? 'stepleft' : (step gt wizard.stepNumbetCurrent ? 'stepright' : 'stepcurrent'))}"
title="#{(step != wizard.stepNumbetCurrent ? wizard.stepName(step) : '')}" />
</c:forEach>
</c:if>
</rich:panel>
<h:panelGroup styleClass="wizardGenericControls" id="wizardGenericControls#{id}">
<h:outputText value="#{wizard.pageTitleShort}" title="#{wizard.pageTitle}"
styleClass="wizardGenericHeaderPageTitle" id = "wizardGenericHeaderPageTitle#{id}" />
<rich:spacer width="10" height="10" />
<a:commandLink
rendered="#{!empty wizard.aktSite.pageDescription.getText()}"
action="#{wizard.switchShowDescription}"
reRender="wizardGenericFormSDiv#{id},wizardGenericDescription#{id},showDescription#{id}"
eventsQueue="eventsQueue"
id="showDescription#{id}"
ignoreDupResponses = "true"
title = "#{wizard.showDescription ? msg.hideDescription : msg.showDescription}">
<h:panelGroup>
<h:outputText value="i" styleClass="wizardHelp"/>
</h:panelGroup>
</a:commandLink>
<h:outputLink target="_blank" value="/profiler/help.pdf">
<h:panelGroup>
<h:outputText value="?" styleClass="wizardHelp"/>
</h:panelGroup>
</h:outputLink>
</h:panelGroup>
</h:form>
</rich:modalPanel>
많은 코드를 볼 필요가 없습니다. 패널에 문제가있는 경우 내용과 관련이 없습니다.) CSS와 관련이 있기 때문에 코드를 검사하고 패널 배경을 확인해야합니다. 또한 @styleClass없이 시도해야합니다. – Makhiel
.css 클래스와 패널의 배경을 확인하는 3 일 동안 같이 머물렀다. 하지만 크롬에서 출력을 저장하고 IE11에서 열어보기 위해 노력했기 때문에 확실한 것은 아닙니다. 그러나이 문제는 여전히 조금 이상합니다. @styleClass를 제거해 보겠습니다. – user3094603
아 btw 통해 UR 회신 주셔서 감사합니다 :) – user3094603