primefaces菜单无法以全页布局完全显示 [英] primefaces menu cant fully display out in fullpage layout

问题描述

几天前，我在primefaces论坛上问了1个问题，但没有人回复我.

few days ago i ask 1 question in primefaces forum but nobody reply me.

在整版布局(position ="west")中使用时遇到问题，子菜单无法完全显示. 我不希望增加西面布局的宽度，是否可以使其重叠显示在(position ="center")上?

I facing a problem while using in fullpage layout(position="west"), the submenu can't fully display out. Can make it display overlap to the (position="center") as I don't wish to increase the width of the west layout?

下面的链接标记以图片为参考.

below link atatch with a picture as reference.

http://www.imagebucket.net/bucket/is.php ?i = 10434& img = image.jpg

这是代码的一部分:

<p:layoutUnit position="west" size="200" >  
  <ui:insert name="sideBar">                        
    <h:form>
      <p:menu type="tiered" >  
        <p:submenu label="Sales" >                                      
          <p:menuitem disabled="#{user.customer}" value="Approve" url="/sales/approve.jsf" style="width:50px" />                                                
        </p:submenu> 
        <p:separator />  
        <p:submenu label="Customer">   
          <p:menuitem disabled="#{user.sales}" value="customer" url="/customer/customer.jsf" style="width:50px" />
        </p:submenu>
      </p:menu>
    </h:form>          
  </ui:insert>  
</p:layoutUnit>

我只是将素数更新为3.1，发现有1个功能overlayPanel，我是否可以使用它解决我的问题?

I just update primefaces to 3.1, and found out got 1 feature overlayPanel, may I know whether it can be used to solve my problem?

先谢谢了.

[Eclipse Indigo，tomcat 7，Java EE 6，PrimeFaces 3.1，Mojarra 2.0.3]

[Eclipse Indigo, tomcat 7, Java EE 6, PrimeFaces 3.1, Mojarra 2.0.3]

推荐答案

最终在primefaces论坛上得到某人的回复.
它解决了我的问题.
这是链接:
http://forum.primefaces.org/viewtopic .php?f = 3& t = 18033& p = 56425#p56425

finally got someone reply my post in the primefaces forum.
It solved my problem.
here is the link:
http://forum.primefaces.org/viewtopic.php?f=3&t=18033&p=56425#p56425

更新:
答:一些CSS技巧将能够修复它，只需更改溢出和z-index属性即可.
我附上以下答案代码:

update:
answer: some css tricks will be able to fix it, just change the overflow and z-index property.
I attach the answer code as below:

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

<p:layoutUnit position="west" size="200" id="leftPanel">  
  <ui:insert name="sideBar">                        
    <h:form>
      <p:menu type="tiered" >  
        <p:submenu label="Sales" >                                      
          <p:menuitem disabled="#{user.customer}" value="Approve" url="/sales/approve.jsf" style="width:50px" />                                                
        </p:submenu> 
        <p:separator />  
        <p:submenu label="Customer">   
          <p:menuitem disabled="#{user.sales}" value="customer" url="/customer/customer.jsf" style="width:50px" />
        </p:submenu>
      </p:menu>
    </h:form>          
  </ui:insert>  
</p:layoutUnit>

这篇关于primefaces菜单无法以全页布局完全显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！