<Canvas x:Name="MyComment" Visibility="Collapsed">
<Canvas.Resources>
<Storyboard x:Name="myStoryboardon">
<DoubleAnimation
Storyboard.TargetName="myComImage"
Storyboard.TargetProperty="Opacity"
From="0.0" To="1.0" Duration="0:0:1"
/>
</Storyboard>
<Storyboard x:Name="myStoryboardoff">
<DoubleAnimation
Storyboard.TargetName="myComImage"
Storyboard.TargetProperty="Opacity"
From="1.0" To="0.0" Duration="0:0:1"
/>
</Storyboard>
</Canvas.Resources>
<Rectangle Fill="#666666" Opacity='0.5' Width="935" Height="750" />
<Image Height='530' Width='420' Source='assets/comment.png' Canvas.Top="100" Canvas.Left="250" x:Name="myComImage"/>
<Rectangle Width="37" Height="16" Fill="#FFFFFFFF" Stroke="#FF000000" Canvas.Left="625" Canvas.Top="105" Opacity="0" Cursor="Hand" MouseLeftButtonDown="closeComment"/>
<Rectangle Width="76" Height="26" Fill="#FFFFFFFF" Stroke="#FF000000" Canvas.Left="577" Canvas.Top="586" Opacity="0" Cursor="Hand" MouseLeftButtonDown="PostComment"/>
<Canvas x:Name="closebtn" Cursor="Hand" Visibility="Collapsed">
<TextBlock Text='Click me:' FontSize='35' Foreground='White' Opacity='1' />
</Canvas>
</Canvas>
Javascript:
sender.findName("myStoryboardon").begin();
sender.findName("myStoryboardoff").begin();