2012-02-06 9 views
5

hace unos días hago 1 pregunta en el foro de Primefaces pero nadie me responde.menú de las caras no se puede mostrar completamente en el diseño de la página completa

Enfrentando un problema al utilizar en el diseño de página completa (posición = "oeste"), el submenú no puede mostrarse completamente. ¿Puede hacer que se superponga a la (posición = "centro") ya que no deseo aumentar el ancho de la disposición oeste?

debajo del enlace atatch con una imagen como referencia.

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

esto es parte del código:

<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> 

acabo de actualizar PrimeFaces a 3,1, y descubrí tiene 1 función overlayPanel, se puede saber si se puede utilizar para resolver mi problema ?

gracias de antemano ..

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

+0

Esta no es una respuesta, pero sólo un poco de información. Por defecto, el elemento DOM del submenú tiene un estilo en línea establecido para un 'z-index: 1001' cuando es' display: none'; sin embargo, cuando está configurado a 'display: block' desde un evento hover de Javascript, ese mismo evento es también aumenta el 'z-index: 1018'. El problema con esto es que incluso si establece un estilo en línea, es probable que sea reemplazado por los JavaScript de Primefaces. Pero incluso así, no creo que el índice z sea la causa, ya que el índice z para el panel central generalmente se establece en 1 por defecto. Esto ciertamente no parece un problema fácil. –

Respuesta

9

finalmente consiguieron a alguien contesta mi mensaje en el foro PrimeFaces.
Resolvió mi problema.
Este es el enlace:
http://forum.primefaces.org/viewtopic.php?f=3&t=18033&p=56425#p56425

actualización:
respuesta: algunos trucos CSS serán capaces de solucionarlo, basta con cambiar la propiedad de desbordamiento y z-index.
adjunto el código de respuesta de la siguiente manera:

<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> 
Cuestiones relacionadas