# EuiScrollHandlerElementDirective

**Type:** directive



Directive toggling CSS class on any element when scrolling past a custom threshold.
More flexible alternative to euiScrollHandler with configurable element ID, class, and height.
Monitors window scroll and applies specified class when threshold exceeded.

```html
<div euiScrollHandlerElement="myNav"
     toggleClass="nav-fixed"
     [toggleActiveHeight]="100">
  Navigation content
</div>
```

### Accessibility
- Visual feedback for scroll position
- Does not affect keyboard navigation or screen readers
- Ensure element remains accessible in both states

### Notes
- Element ID specified via euiScrollHandlerElement input
- CSS class specified via toggleClass input
- Scroll threshold specified via toggleActiveHeight input (in pixels)
- Class added when scroll position exceeds toggleActiveHeight


**Selector:** `[euiScrollHandlerElement]`

## Inputs
- **euiScrollHandlerElement**: `string` - 
- **toggleActiveHeight**: `number` - 
- **toggleClass**: `string` - 
