0

在 IE7 下面的代码 p:accordionPanel over laps p:menubar.ie. 中,当我点击菜单栏时,菜单项隐藏在 p:accordionPanel 下。但是在 Chrome 和 Firefox 中没有问题。

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:p="http://primefaces.org/ui">
        <h:head>    
        </h:head>
        <h:body>
   <h:form>         
       <p:menubar>  
            <p:submenu label="Company" >
            <p:menuitem value="Software Engineer" />
            <p:menuitem value="Manager" />  
            <p:menuitem value="Business Ananlyst"  />
            <p:menuitem value="System Analyst" />
            </p:submenu>
    </p:menubar>

        <p:accordionPanel>
            <p:tab title="Lorem Ipsum ">
                <h:panelGrid columns="3">
                    <h:outputText
                        value="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum"></h:outputText>
                </h:panelGrid>
            </p:tab>
        </p:accordionPanel>
    </h:form>
    </h:body>

</html>
4

1 回答 1

0

可以通过给 <p:menubar />then更大的 z-index 来解决<p:accordionPanel />

在我的示例中,我所做的更改是

<p:menubar style="z-index:2000">
<p:accordionPanel style="z-index:1000">

但是,如果有多个组件,则可以使用 jquery 来解决。首先声明的组件的 z-index 将大于后面的

$(document).ready(function(){
 var zIndexNumber = 1000;
        $('div').each(function() {
            $(this).css('zIndex', zIndexNumber);
            zIndexNumber -= 10;
        });
});
于 2013-09-18T11:26:48.017 回答