Microsoft Silverlight will reach end of support after October 2021. Learn more.

Represents an object that contains audio, video, or both.

<MediaElement   .../>


Attributes, AutoPlay, AudioStreamCount, AudioStreamIndex, Balance, BufferingProgress, BufferingTime, CanPause, CanSeek, Canvas.Left, Canvas.Top, Canvas.ZIndex, Clip, CurrentState, Cursor, DownloadProgress (MediaElement), DroppedFramesPerSecond (Silverlight 2), Effect (Silverlight 3), Grid.Column (Silverlight 2), Grid.ColumnSpan (Silverlight 2), Grid.Row (Silverlight 2), Grid.RowSpan (Silverlight 2), Height (UIElement), HorizontalAlignment (Silverlight 2), IsMuted, Margin (Silverlight 2), Markers, MaxHeight (Silverlight 2), MaxWidth (Silverlight 2), MinHeight (Silverlight 2), MinWidth (Silverlight 2), Name (DependencyObject), NaturalDuration, NaturalVideoHeight, NaturalVideoWidth, Opacity (UIElement), OpacityMask, Position, Projection (Silverlight 3), RenderTransform, RenderedFramesPerSecond (Silverlight 2), RenderTransformOrigin, Resources, Source (MediaElement), Stretch (MediaElement), Style (UIElement) (Silverlight 2), Tag, Triggers, VerticalAlignment (Silverlight 2), Visibility, Volume, Width (UIElement)

Managed Equivalent



A MediaElement object is a rectangular region that can display video on its surface or play audio. (For audio, no video displayed, but the MediaElement still acts as a player object with appropriate APIs.) Because it is a UIElement object, a MediaElement supports input operations such as mouse and keyboard events, and can capture focus. You can specify the height and width of the video display surface by using the Height and Width properties of UIElement. However, for best performance, do not set the width and height of a MediaElement object. Instead, let the media display at its natural size. If you have to change the size of the media display, it is best to use a media-encoding tool to re-encode the media to the target size.

By default, the media that is defined by the Source property plays immediately after the MediaElement object has loaded. To suppress the media from starting automatically, set the AutoPlay property to false.

Silverlight does not support all media formats and protocols. For more information, see Supported Media Formats, Protocols, and Log Fields.

In networks where a proxy server exists, special settings on the client may be required before streaming will work in Silverlight.

For more information on basic concepts, see Audio and Video Overview. Note that the Audio and Video Overview topic is written primarily for users of the managed API, and may not have code examples or specific information that address the JavaScript API scenarios.


The following example demonstrates how to add media to your page. The XAML example references an event handler function that must be defined in script and is not shown in the example.

    Width="300" Height="300"/>