You all must have seen HTML Anchor links, this is actually called link within page and used to navigate between page sections
Same as HTML anchor tag ADF Faces has <af:scrollComponentIntoViewBehavior> tag that allows user to jump to a particular component on page
See what docs says-
The scrollComponentIntoViewBehavior tag is a declarative way to have a command component (e.g. a button) scroll a component into view and optionally set focus in it. This tag will be ignored for any server-rendered components, as it is only supported for the rich client.
The scrollComponentIntoViewBehavior tag cancels server-side event delivery automatically - so actionListener or action attributes on the parent component will be ignored. This cannot be disabled. Developers that need to also trigger server-side functionality can add an additional client listener that uses AdfCustomEvent and af:serverListener to deliver a server-side event.
So in this post i am using 5 images and 5 buttons to navigate to each image, set clientComponent property of all af:image to true because this tag is supported only by client rendered components.
Dropped scrollComponentIntoViewBehavior under all buttons and provided id of respective af:image component
See XML source of page -
Page looks like this -
Cheers:) Happy Learning