title: WPF Border element background animation
body: <p>I want to animate the background of a border when the mouse is enters and leaves.</p>
  
  <p>Here is my code</p>
  
  <pre class="lang-xaml prettyprint-override"><code>       &lt;Style TargetType="{x:Type Border}"&gt;
          &lt;Style.Triggers&gt;
              &lt;EventTrigger RoutedEvent="Border.MouseEnter"&gt;
                  &lt;EventTrigger.Actions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ColorAnimation Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" To="#6990EE90" Duration="0:0:0.3" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/EventTrigger.Actions&gt;
              &lt;/EventTrigger&gt;
              &lt;EventTrigger RoutedEvent="Border.MouseLeave"&gt;
                  &lt;EventTrigger.Actions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ColorAnimation Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" To="Transparent" Duration="0:0:3" /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/EventTrigger.Actions&gt;
              &lt;/EventTrigger&gt;
          &lt;/Style.Triggers&gt;
      &lt;/Style&gt;
  
  ...
  
      &lt;ListBox Height="158" Name="lstStats" Width="Auto" HorizontalAlignment="Stretch" Margin="0" ItemsSource="{Binding ApplicationStatsValues}" Background="Transparent" BorderThickness="0"&gt;
          &lt;ListBox.ItemTemplate&gt;
              &lt;DataTemplate&gt;
                  &lt;Border Name="lulu" BorderThickness="1" Opacity="0.8" BorderBrush="LightGreen" CornerRadius="3" Margin="0,0,0,2"&gt;
                  &lt;Border.Background&gt;
                      &lt;SolidColorBrush /&gt;
                  &lt;/Border.Background&gt;
                  &lt;DockPanel Height="60" Width="284" HorizontalAlignment="Stretch" VerticalAlignment="Top"&gt;
                      &lt;TextBlock DockPanel.Dock="Bottom" Text="{Binding Description}" Height="30" Width="Auto" VerticalAlignment="Center" /&gt;
                      &lt;TextBlock DockPanel.Dock="Left" Text="{Binding Title}" Height="30" Width="220" VerticalAlignment="Center" /&gt;
                      &lt;TextBlock DockPanel.Dock="Right" Text="{Binding Value}" Height="30" Width="80" VerticalAlignment="Center" /&gt;
                  &lt;/DockPanel&gt;
                  &lt;/Border&gt;
              &lt;/DataTemplate&gt;
          &lt;/ListBox.ItemTemplate&gt;
      &lt;/ListBox&gt;
  </code></pre>
  
  <p>The problem is that i always get this error :</p>
  
  <p><strong>'Background' property does not point to a DependencyObject in path '(Background).(0)'.</strong></p>
  
  <p>This works perfectly with <code>&lt;Style Targetype="ListBoxItem"&gt;</code> but I don't want the background of the list item to change, it looks ugly. I want the border background to change because of the round border.</p>
  
  <p>So the question is : how those DependencyObject works and how can i determine which one is the correct one for a given object, and can anyone make this works ?</p>
  
  <p>Thanks for your help !</p>