2012-02-06 3 views
5

며칠 전 primefaces 포럼에서 1 개의 질문을하지만 아무도 대답하지 않습니다.primefaces 메뉴는 전체 페이지 레이아웃으로 완전히 표시되지 않습니다.

전체 페이지 레이아웃 (position = "west")에서 사용하는 동안 문제가 발생하면 하위 메뉴를 완전히 표시 할 수 없습니다. west 레이아웃의 너비를 늘리지 않으려면 (position = "center")에 겹쳐서 표시 할 수 있습니까?

아래 그림을 참조하십시오.

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> 

나는 내 문제를 해결하기 위해 사용할 수 있는지 여부를 알 수 있습니다 난 그냥, overlayPanel을 3.1 primefaces를 업데이트 한 기능을 가지고 발견 ? 사전에

덕분에 ..

가 [이클립스 인디고, 바람둥이 7, 자바 EE 6, 인 Mojarra 2.0.3 3.1 PrimeFaces]

+0

이 대답하지만, 그냥 몇 가지 정보가 없습니다. 기본적으로 하위 메뉴 DOM 요소는'display : none' 일 때 'z-index : 1001'에 대해 인라인 스타일을 설정하지만 Javascript 호버 이벤트에서'display : block '으로 설정된 경우 동일한 이벤트가 'z-index : 1018'도 증가했다. 이 문제는 인라인 스타일을 설정하더라도 Primefaces javascript에 의해 재정의 될 가능성이 높습니다. 그러나 그때조차 센터 패널의 Z- 인덱스가 대개 기본적으로 1로 설정되므로 Z- 인덱스가 원인이라고 생각하지 않습니다. 이것은 확실히 쉬운 문제처럼 보이지 않습니다. –

답변

9

마침내 누군가가 primefaces 포럼에서 내 게시물 답장을 얻었다.
내 문제가 해결되었습니다.
여기 링크입니다 :
http://forum.primefaces.org/viewtopic.php?f=3&t=18033&p=56425#p56425

업데이트 :
답 : 일부 CSS 트릭, 그것을 해결 단지 오버 플로우 및 Z- 인덱스 속성을 변경할 수 있습니다.
나는 다음과 같이 대답 코드를 첨부 :

<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> 
관련 문제