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

Animation.open

configuration

The animation played when the calendar popup is opened.

animation.open

Object

<div id="popup">CONTENT</div>
<script>
$("#popup").kendoPopup({
  animation: {
   open: {
     effects: "zoom:in",
     duration: 300
   }
  }
}).data("kendoPopup").open();
</script>

animation.open.duration

Number

The duration of the open animation in milliseconds.

<div id="popup">CONTENT</div>
<script>
$("#popup").kendoPopup({
  animation: {
   open: {
     duration: 1000
   }
  }
}).data("kendoPopup").open();
</script>

animation.open.effects

String

The effect(s) to use when playing the open animation. Multiple effects should be separated with a space.

Complete list of available animations

<div id="popup">CONTENT</div>
<script>
$("#popup").kendoPopup({
  animation: {
   open: {
     effects: "fadeIn zoom:in"
   }
  }
}).data("kendoPopup").open();
</script>