2.2 KiB
title, ms.date, dev_langs, helpviewer_keywords, ms.assetid
| title | ms.date | dev_langs | helpviewer_keywords | ms.assetid | |||||
|---|---|---|---|---|---|---|---|---|---|
| How to: Create a Rollover Effect Using Events | 03/30/2017 |
|
|
3b20d028-6f1c-4b25-95d2-fa68cefbdb4c |
How to: Create a Rollover Effect Using Events
This example shows how to change the color of an element as the mouse pointer enters and leaves the area occupied by the element.
This example consists of a [!INCLUDETLA#tla_xaml] file and a code-behind file.
Note
This example demonstrates how to use events, but the recommended way to achieve this same effect is to use a xref:System.Windows.Trigger in a style. For more information, see Styling and Templating.
Example
The following XAML creates the user interface, which consists of xref:System.Windows.Controls.Border around a xref:System.Windows.Controls.TextBlock, and attaches the xref:System.Windows.Input.Mouse.MouseEnter and xref:System.Windows.UIElement.MouseLeave event handlers to the xref:System.Windows.Controls.Border.
[!code-xamlmouseenterMouseleave#MouseEnterLeaveSampleXAML]
The following code behind creates the xref:System.Windows.UIElement.MouseEnter and xref:System.Windows.UIElement.MouseLeave event handlers. When the mouse pointer enters the xref:System.Windows.Controls.Border, the background of the xref:System.Windows.Controls.Border is changed to red. When the mouse pointer leaves the xref:System.Windows.Controls.Border, the background of the xref:System.Windows.Controls.Border is changed back to white.
[!code-csharpmouseenterMouseleave#MouseEnterLeaveSampleEventHandlers] [!code-vbmouseenterMouseleave#MouseEnterLeaveSampleEventHandlers]