Need help to change the code for wpf animation

i am beginner in wpf. i got a code from a site for wpf animation. animation start when dock panel load. i want to change animation play time. i want when user click on Ellipse then animation start and when user click on dock panel then animation will stop.here is code.

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <DockPanel>
        <Ellipse Width="200" Height="200" Name="MyEllipse">
            <Ellipse.Fill>
                <RadialGradientBrush >
                    <GradientStop Offset="0" Color="#CCCCCCCC" />
                    <GradientStop Offset="0.5" Color="white" />
                    <GradientStop Offset="1" Color="black"/>
                </RadialGradientBrush >
            </Ellipse.Fill>
        </Ellipse>
        <DockPanel.Triggers>
            <EventTrigger RoutedEvent="Page.Loaded">
                <BeginStoryboard Name="MyBeginStoryBoard">
                    <Storyboard Name="MyStoryBoard">
                        <DoubleAnimation Storyboard.TargetName="MyEllipse" Storyboard.TargetProperty="(Ellipse.Height)" 
           From="0" To="200" AutoReverse="true"
           RepeatBehavior="0:0:10" BeginTime="0:0:0" />
                        <DoubleAnimation Storyboard.TargetName="MyEllipse" Storyboard.TargetProperty="(Ellipse.Width)" 
           From="0" To="200" AutoReverse="true"
           RepeatBehavior="0:0:10" BeginTime="0:0:0" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </DockPanel.Triggers>
    </DockPanel>
</Grid>

Answers

Change the RoutedEvent to PreviewMouseDown instead of Page.Loaded.

EDIT : You can stop the animation by adding this trigger to the DockPanel.Triggers:

<EventTrigger SourceName="MyEllipse" RoutedEvent="Ellipse.PreviewMouseDown">
    <StopStoryboard BeginStoryboardName="MyBeginStoryBoard" />
</EventTrigger>

This will let you stop the animation by clicking on the Ellipse. See MSDN for samples on pause/resume etc.

Need Your Help