ScrollBar width change when hovering over it

There is a vertical scroll, which when getting the focus should expand a little.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Style TargetType="{x:Type ScrollBar}" > <Style.Resources> <Style x:Key="ScrollBarThumbStyle" TargetType="{x:Type Thumb}"> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Focusable" Value="True"/> <Setter.Value> <ControlTemplate TargetType="{x:Type Thumb}"> <Rectangle Fill="#36B448" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}"> <Grid Background="#FFB1B1B1" Width="5" > <Track Name="PART_Track" IsDirectionReversed="True"> <Track.Thumb> <Thumb Style="{StaticResource ScrollBarThumbStyle}" /> </Track.Thumb> </Track> </Grid> </ControlTemplate> <Style.Triggers> <Trigger Property="Orientation" Value="Horizontal"> <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}"/> </Trigger> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Width" Value="22" /> </Trigger> <!--<Trigger Property="Control.IsFocused" Value="True"> <Setter Property="Width" Value="15"></Setter> </Trigger>--> </Style.Triggers> 

The uncommented trigger works fine, but the trigger does not fire once when you hover the cursor, the second (commented out) theoretically should work, but this does not happen.

It would be ideal if IsFocused took the value true when hovering not only the scroll itself, but also the area around it (1-2 pixels). How to do this?

I have a suspicion that through EventTrigger-ы it’s easier to implement.