Create new RichFaces Documentation Jira issue
This will launch the RichFaces Jira page - to complete your feedback please login if needed, and submit the Jira.
JBoss.orgCommunity Documentation
When using RichFaces components library you've got nealy everything to build UI, making a tooltip is not an exception. RichFaces provides a separate component to make a bubble appeared when the user hovers a UI element or layout area. The component is <rich:toolTip>. There's nothing complicated in using <rich:toolTip>: you just need to set the text to be shown in the tooltip with the "value" attribute and specify for which component you want the tooltip to be shown with the "for" attribute that takes the id of the targeted component as a parameter.
...
<rich:panel id="panelId">
<p>Element which has a tooltip</p>
</rich:panel>
<rich:toolTip value="This is a tooltip." for="panelId"/>
...
Alternatively, you can just place <rich:toolTip> as a nested element of container for which the tooltip is shown.
...
<div>
<p>Element which has a tooltip</p>
<rich:toolTip>
<p>Tooltip text</p>
</rich:toolTip>
</div>
...
This approach was adopted in the Photo Alum to display tooltips for
This code outputs an album's image.
...
<a4j:mediaOutput id="img" element="img" styleClass="main-image"
createContent="#{imageLoader.paintImage}" style="border : 3px solid #808080;"
value="#{fileManager.transformPath(model.selectedImage.fullPath, '_medium')}">
</rich:dragSupport>
<rich:toolTip followMouse="true" direction="top-right"
showDelay="500" styleClass="tooltip" rendered="#{model.selectedImage.showMetaInfo}">
<span style="white-space:nowrap; display:block; text-align:left;">
<h:outputText value="Size in bytes: #{model.selectedImage.size}" />
<br />
<h:outputText
value="#{messages['original_size']}: #{model.selectedImage.height}x#{model.selectedImage.width}" />
<br />
<h:outputText value="Captured at: #{model.selectedImage.created}" />
<br />
<h:outputText
value="#{messages['camera']}: #{model.selectedImage.cameraModel}" />
</span>
</rich:toolTip>
</a4j:mediaOutput>
...
The <rich:toolTip> is nested in <a4j:mediaOutput> and prints the size of the image, size in pixels, when the picture was taken and the type of camera used to take the picture.
