如何在rich中添加最小化和最大化按鈕：popup面板窗口

像下面一樣，我們如何在richface彈出式面板的頁面右上角添加最小化和最大化按鈕？如何在rich中添加最小化和最大化按鈕：popup面板窗口

使用下面的代碼，我們可以在右上角添加'X'，點擊這個彈出窗口關閉。

<f:facet name="controls"> 
    <h:outputLink value="#" 
     onclick="#{rich:component('simplePopup2')}.hide(); return false;"> 
      X 
    </h:outputLink> 
</f:facet>

請建議我。

來源

2012-01-25 Jaikrat

有可能擴展jQuery與兩個自定義函數，將盡最大/最小化。

(function($) { 
    $.fn.maximize = function() { 
     var $this = $(this); 
     var viewport = $(window); 
     var bt = $this.css('border-top-width'); 
     var br = $this.css('border-right-width'); 
     var bb = $this.css('border-bottom-width'); 
     var bl = $this.css('border-top-width'); 
     bt = bt ? parseInt(bt) : 0; 
     br = br ? parseInt(br) : 0; 
     bb = bb ? parseInt(bb) : 0; 
     bl = bl ? parseInt(bl) : 0; 

     $this.css({ 
      width: (viewport.width() - (bl + br)) + 'px', 
      height: (viewport.height() - (bt + bb)) + 'px', 
      top: 0, 
      left: 0 
     }); 

     $this.find('div.rf-pp-cnt-scrlr').css({ 
      width: 100 + '%', 
      height: 100 + '%' 
     }); 
    } 

    $.fn.minimize = function() { 
     var $this = $(this); 
     var viewport = $(window); 

     $this.css({ 
      width: '170px', 
      height: '20px', 
      top: (viewport.height() - 20), 
      left: 0 
     }); 

     $this.find('div.rf-pp-shdw').hide(); 
     $this.find('div.rf-pp-cnt-scrlr').hide(); 
    }    
})(jQuery);

比你可以調用最大化之前，RichFaces的popupPanel

<rich:popupPanel id="window"> 
    <f:facet name="controls"> 
     <h:outputLink value="#" onclick="#{rich:component('window')}.cdiv.minimize(); return false;"> 
      <h:outputText value="Minimize"/> 
     </h:outputLink> 
     <h:outputText value=" | "/> 
     <h:outputLink value="#" onclick="#{rich:component('window')}.cdiv.maximize(); return false;"> 
      <h:outputText value="Maximize"/> 
     </h:outputLink> 
     <h:outputText value=" | "/>   
     <h:outputLink value="#" onclick="#{rich:component('window')}.hide(); return false;"> 
      <h:outputText value="Close"/> 
     </h:outputLink>    
    </f:facet>  
    <h:outputText value="Window"/> 
</rich:popupPanel>

注意.cdiv使用/最小化功能。這是爲了引用jQuery對象本身，所以可以訪問新的函數。

以上所提供的功能只是一個概念證明，所以你必須給他們，以便擴大到能夠恢復到原來的大小等。

來源

2012-01-25 14:05:15

嘿感謝，但我們不應該使用jQuery現在。是否有任何其他方式可以帶來這些選項的JavaScript或JSF功能。 – Jaikrat

@JaikratSingh如果您使用Richfaces，而不是開箱即用jQuery。否則，可以創建與將cdiv作爲參數的常規js函數相同的函數。 cdiv將是一個Jquery對象，所以你將不得不從它中提取DOM對象。有關如何執行此操作，請參閱jQuery文檔。 –

讓我這麼做，謝謝你的建議Mmanco。 – Jaikrat

如何在rich中添加最小化和最大化按鈕：popup面板窗口

回答

相關問題