I have a WPF control that I want to animate, based on the value of a property IsInteracting defined on the containing UserControl (named "UserControl"). I have the following style defined in the UserControl, with the animation targeting a Grid also defined in the UserControl.

```
<UserControl.Resources>
    <Style TargetType="Grid">
        <Setter Property="Opacity" Value="0" />
        <Setter Property="Height" Value=""></Setter>
        <Style.Triggers>
            <Trigger Property="IsInteracting" Value="True" SourceName="UserControl">
                <Trigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames
                                Storyboard.Target="{Binding ElementName=ControlGrid}"
                                Storyboard.TargetProperty="Opacity"
                                >
                                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="1"/>
                                <EasingDoubleKeyFrame KeyTime="0:0:1.3" Value="0"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </Trigger.EnterActions>
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Resources>

```

This isn't working as the name "UserControl" isn't recognised. I believe there are scoping issues which prevent the referencing of elements outside of the style?

How do I do what I'm trying to do?