下面的CSS打开一个模态窗口中的iframe中,因为它应该。 不过,我想模式弹出叠加只是ifram内的家长,而不是。 是否有修改CSS去覆盖父弹出菜单的方式吗? 正如一个侧面说明,iFrame的ID可能会改变,所以我不能够依赖于特定的ID。 所有的建议表示赞赏,我甚至会考虑其他工具如javascript。
<iframe frameborder="no" height="200px" id="066E0000001KmQ9" marginheight="0" marginwidth="0" name="066E0000001KmQ9" scrolling="no" title="PredictiveWholesalingRelatedList" width="100%">
<apex:page standardController="Contact"
extensions="myExtension"
sidebar="false"
showHeader="false"
title="My Page">
<apex:form >
<apex:commandButton value="Show Pop up" action="{!showPopup}" rerender="tstpopup"/>
<apex:pageBlock >
This is just filler text from the Salesforce General.
</apex:pageBlock>
<apex:outputPanel id="tstpopup">
<apex:outputPanel styleClass="popupBackground" layout="block" rendered="{!displayPopUp}"/>
<apex:outputPanel styleClass="custPopup" layout="block" rendered="{!displayPopUp}">
This is where I would put whatever information I needed to show to my end user.<br/><br/><br/>
<apex:commandButton value="Hide Pop up" action="{!closePopup}" rerender="tstpopup"/>
</apex:outputPanel>
</apex:outputPanel>
</apex:form>
<style type="text/css">
.custPopup{
background-color: white;
border-width: 2px;
border-style: solid;
z-index: 9999;
left: 50%;
padding:10px;
position: absolute;
width: 500px;
margin-left: -250px;
top:100px;
}
.popupBackground{
background-color:black;
opacity: 0.20;
filter: alpha(opacity = 20);
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 9998;
}
</style>
我想用这个例子: http://www.salesforcegeneral.com/salesforce-modal-dialog-box/