PrimeFacesのツールチップの位置

Question

JSFページの構造：

<h:form style="float:left"> 
... 
</h:form> 

<div style="float: left; width: 350px"> 
    ... 
    <p:rating id="present" value="#{ph.currentProduct.present}" readonly="true" /> 
    <p:tooltip for="present" value="..." /> 
</div> 

<h:form class="detail_buy_button"> 
... 
</h:form> 

ツールチップボックスの位置を定義しますか？コードにはp:tooltipの特殊なスタイルは含まれていませんが、ツールチップ要素はx位置のdetail_buy_buttonに表示されます。詳細はスクリーンショットがあります。

Answer 1

私はネイティブPrimefacesツールチップのスタイルを設定する簡単な方法があるかどうかわからないんだけど、1つのオプションPrimefaces Extensions

名前空間からツールチップコンポーネントを使用することです：

xmlns:pe="http://primefaces.org/ui/extensions"

使用：

<p:rating id="present" ../> 
    <pe:tooltip value="test" for="present" 
       myPosition="top left" 
       atPosition="bottom right"/> 

myPosition：ターゲット要素に関連した位置にツールチップの

コーナー。 デフォルト値は「左上」です。

atPosition：

でツールチップのコーナーを配置するターゲット要素のコーナー。デフォルト値は「右下」です。