New to Kendo UI for jQuery? Start a free 30-day trial

Animation.open

configuration

The animation that will be used when a Dialog opens.

animation.open

Object

<div id="dialog"></div>
<script>
$("#dialog").kendoDialog({
  title: "Kendo Dialog Component",
  content: "This is your Kendo Dialog.",
  animation: {
    open: false
  },
  visible: false
});
$("#dialog").data("kendoDialog").open();
</script>

animation.open.duration

Number

Defines the open animation duration.

<div id="dialog"></div>
<script>
$("#dialog").kendoDialog({
  title: "Kendo Dialog Component",
  content: "This is your Kendo Dialog.",
  animation: {
    open: {
      duration: 100
    }
  },
  visible: false
});
$("#dialog").data("kendoDialog").open();
</script>

animation.open.effects

String

Effect to be used for opening of the popup.

<div id="dialog"></div>
<script>
$("#dialog").kendoDialog({
  title: "Kendo Dialog Component",
  content: "This is your Kendo Dialog.",
  animation: {
    open: {
      effects: "fade:in"
    }
  },
  visible: false
});
$("#dialog").data("kendoDialog").open();
</script>