In this article I'll walk through the creation of a vertical Marquee as seen on ekleeman.com on the upper left of the main page.
This app consists of a Canvas, a Canvas.Clip and two animated Canvas that scroll the content. The XAML for the clipped Canvas and the first scrolling Canvas:
You can see that the clipped area is 240x165 and the first scrolling Canvas is the same size only positioned exactly at Canvas.Top = 165. The animation is going to move the Canvas.Top property of the target to -165 over a period of 30 seconds. This moves the first scrolling Canvas to just out of view at the top of the clipped area. The content for the scrolling Canvas is a StackPanel with it's contents being a series of HyperlinkButtons.
The number and size of the HyperlinkButtons should exactly fill the scrolling Canvas. You can adjust the size of your scrolling Canvas to accomodate whatever content you have. Here's where the fun begin's. Add another Canvas exactly like the first scrolling Canvas with a few differences:
As you can see the second scrolling Canvas is the same as the first except for the name and the BeginTime attribute which is set to 15 seconds. This will start the second scrolling Canvas at the exact moment the first scrolling Canvas reaches the top of the clipped area. This gives the appearance of a continuosly scrolling group of hyperlinks. The only thing left is to add some user interaction. Here's the .cs
All this code does is pause the scrolling on a MouseEnter and resume scrolling on a MouseLeave so the user can click a link. Viola!
The same technique can be used to create a horizontal scrolling marquee by just animating the Canvas.Left property instead of the Canvas.Top property and size your clipped area accordingly.