O'Reilly logo

PrimeFaces Cookbook - Second Edition by Oleg Varaksin, Mert Çalışkan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Sticking a component when scrolling

The Sticky component is used to make another component stick to the top of the page once a user has scrolled past it. Hence, the sticky component requires a target component to keep it in the viewport on scroll.

In this recipe, we will demonstrate the usage of the p:sticky tag.

How to do it…

We would like to stick a select menu with a label as shown in this screenshot:

How to do it…

The select menu and the label are placed within h:panelGrid, which acts as the target component:

<h:panelGrid id="langGrid" columns="2" style="box-shadow: none;"> <p:outputLabel for="lang" value="Language: "/> <p:selectOneMenu id="lang"> <f:selectItem ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required