Sticky Scrollbar is a lightweight and responsive UI component designed to enhance the user interface experience by making the horizontal scrollbar sticky at the bottom (or any desired position) of a scrollable content area. This ensures that users can easily access the scrollbar without having to scroll to the bottom, especially useful for large tables, wide grids, or horizontally scrollable content.

The component works seamlessly with OutSystems Reactive Web Apps and Traditional Web Apps, providing an improved user experience for data-heavy screens like dashboards, reports, or complex layouts.

Key Features:

• Sticky horizontal scrollbar at the bottom (or configurable position).

• Supports responsive layouts.

• Simple integration — plug-and-play usage.

• Compatible with native scroll behavior.

• Works with tables, div containers, lists, and custom layouts.

• Minimal performance impact.

• Fully customizable via CSS.

• Cross-browser support (Chrome, Edge, Firefox, Safari).

Typical Use Cases:

• Large data tables that overflow horizontally.

• Dashboards with wide charts or grids.

• Responsive layouts with scrollable content.

• Forms or screens where users frequently scroll sideways.

How to Use:

1. Install the component from the Forge.

2. Drag and drop the Sticky Scrollbar block into the screen where horizontal scrolling is needed.

3. Wrap the target content (e.g., a table or div) inside the provided container or reference it via CSS selectors or block parameters.

4. Configure optional parameters (if exposed):

   • Sticky position (top, bottom, custom offset).

   • Styling (color, thickness of scrollbar).

5. Publish the application.

Technical Details:

• Built using pure JavaScript and CSS for better performance.

• Does not require any third-party libraries.

• Automatically adjusts when content resizes.

• No impact on vertical scroll behavior.