Jquery 如何解决p:layout中的primefaces p:megaMenu问题?

Jquery 如何解决p:layout中的primefaces p:megaMenu问题?,jquery,css,jsf,jsf-2,primefaces,Jquery,Css,Jsf,Jsf 2,Primefaces,如何在p:layout中使用p:megaMenu?布局封面菜单内容的内容。 让我知道任何解决方案或建议 template.xhtml <p:layout fullPage="true"> <p:layoutUnit position="north" size="40"> <ui:include src="/common/menu.xhtml"/> </p:layoutUnit> <p:layoutUnit p

如何在
p:layout
中使用
p:megaMenu
?布局封面菜单内容的内容。 让我知道任何解决方案或建议

template.xhtml

<p:layout fullPage="true">
   <p:layoutUnit position="north" size="40">
        <ui:include src="/common/menu.xhtml"/>
   </p:layoutUnit>
   <p:layoutUnit position="center">
        <ui:insert name="content"/>
    </p:layoutUnit>
   <p:layoutUnit position="south" size="40">
        <ui:include src="/common/footer.xhtml"/>
   </p:layoutUnit>
</p:layout>

menu.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui">
       <h:form id="menuForm">
        <p:megaMenu autoDisplay="false">
            <p:menuitem value="Dashboard" action="dashboard" ajax="false" immediate="true"/>  
            <p:submenu label="Report">
                <p:column>
                    <p:submenu label="Agent">
                        <p:menuitem value="Agent Commission Detail Report" action="agentCommissionDetailReport" ajax="false" immediate="true"/>  
                        <p:menuitem value="Agent Information Report" action="agentInformationReport" ajax="false" immediate="true"/>  
                        <p:menuitem value="Sales Report" action="salesReport" ajax="false" immediate="true"/>  
                    </p:submenu>
                </p:column>
            </p:submenu>
        </p:megaMenu>
    </h:form>
</ui:composition>

如下图所示:


我从Primefaces论坛得到了一些解决方案。我通过更改CSS解决了这个问题。 它现在运行良好

<h:head>
    <style>
        #topPanel {z-index:2 !important; }
        #topPanel div{overflow:visible;}
    </style>
</h:head>

<p:layout fullPage="true">
   <p:layoutUnit position="north" size="50" id="topPanel">
        <ui:include src="/common/menu.xhtml"/>
   </p:layoutUnit>

   ......

#topPanel{z-index:2!重要;}
#topPanel div{溢出:可见;}
......

您使用的是哪个PF版本?所有浏览器都一样吗?primefaces-4.0和primefaces-3.5有同样的问题。我只使用Firefox浏览器。