Javatpoint Logo
Javatpoint Logo

RichFaces <rich:popupPanel>

This component provides a pop-up panel that appears in front of the web page. It can be positioned on the screen, dragged to a new position and re-sized by the user.

It does not require any compulsory attribute.

Style classes and skin parameters

The following table contains the Style classes (selectors) and corresponding skin parameters for the popupPanel.

Class Function Skin Parameters Mapped CSS properties
.rf-pp-btn It is used to define styles for the pop-up panel button. No skin parameters.
.rf-pp-shade It is used to define styles for the shading that covers the page when presenting a modal pop-up panel. No skin parameters.
.rf-pp-cntr It is used to define styles for the container for the pop-up panel. panelBorderColor generalBackgroundColor border background
.rf-pp-hdr It is used to define styles for the header of the pop-up panel. headerBackgroundColor background
.rf-pp-hdr-cnt It is used to define styles for the content of the header. headerTextColor headerWeightFont color font-weight
.rf-pp-cnt It is used to define styles for the content of the pop-up panel. generalFamilyFont generalSizeFont font-size background
.rf-pp-cnt-scrlr It is used to define styles for the scroll bars of the pop-up panel. generalBackgroundColor background
.rf-pp-hndlr It is used to define styles for borders of the pop-up panel. The border handler is used to re-size the panel. No skin parameters.
.rf-pp-hndlr-t, .rf-pp-hndlr-b, .rf-pp-hndlr-l, .rf-pp-hndlr-r, .rf-pp-hndlr-tl, .rf-pp-hndlr-tr, .rf-pp-hndlr-bl, .rf-pp-hndlr-br These classes define styles for the top, bottom, left, right, top-left, top-right, bottom-left, and bottom-right edges of the border handler. No skin parameters.

Example

Here, in the following example, we are implementing <rich:popupPanel> component. This example contains the following files.

JSF File

// rich-popup.xhtml

Output:

RichFaces Popuppanel 1

After clicking on the pop-up link.

RichFaces Popuppanel 2




Help Others, Please Share

facebook twitter google plus pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA