Animations

The Telerik UI Window for ASP.NET Core allows you to customize the animation effects upon display via the Animation() configuration option.

The Following example demonstrates how you can configure the Animation effects for the Window:

@(Html.Kendo().Window()
    .Name("window")
    .Title("Window")
    .Animation(animation =>
    {
        animation.Open(open =>
        {
            open.Zoom(ZoomDirection.In);
            open.Fade(FadeDirection.In);
            open.Duration(500);
        });

        animation.Close(close =>
        {
            close.Reverse(false);
            close.Zoom(ZoomDirection.Out);   
            close.Fade(FadeDirection.In);
        });
    })
    .Content("Window Content")
)

<kendo-window name="window" title="Window">
    <popup-animation enabled="true">
        <open effects="zoom:in fade-in" duration="500" />
        <close effects="zoom:out fade-in" duration="350" reverse="false" />
    </popup-animation>
    <content>Window Content</content>
</kendo-window>

See Also

• Adding Animation Effects to the Window (Demo)
• Server-Side API of the Telerik UI Window for ASP.NET Core
• JavaScript API Reference of the Window