How do I change or disable DatePicker animations for selecting months and years?

[Alan]

I've disabled animation for opening and closing the date picker via animation:false. This unfortunately doesn't stop animations when selecting a month or year. How do I disable or change these animations?

[Alan]

I also need control over the animations used when navigating months using the previous and forward arrow links.

[Georgi Krustev]

Hello Alan,

The animation option only controls the popup animation. Currently, the widget does not expose a way to apply a specific options to the underlying Calendar widget.

You can, however, disable them using an additional code - retrieve the calendar widget and disable the animation. Check the following demo that demonstrates this approach:

• http://dojo.telerik.com/@ggkrustev/AdexI

If you want to control the vertical and horizontal effects then you will need to define animation.horizontal and animation.vertical options. Please note that you cannot disable only one direction (you will need to disable all animations at once). In general, the calendar navigation is not exposed, because it builds a special wrapper element to navigate correctly, which shrinks the list of the supported effects.

Regards,
Georgi Krustev
Telerik

 

 

[Alan]

At the very least you should expose an option for animation timing. 300-500ms is way to slow in our case so these animations give our app a sluggish feeling. Thanks for the tip on disabling animations entirely. I guess we will have to use that less than desirable patch for now.

[Georgi Krustev]

Hello Alan,

The animation option allows to define effect duration. Check the updated demo:

• http://dojo.telerik.com/@ggkrustev/AdexI

You can see that every effect allows to define a duration option.

Regards,
Georgi Krustev
Telerik

 

 

[Alan]

I tried changing the values in your demo to this:

animation: {
  horizontal: {
    effects: "fadeIn",
    duration: 75
  },
  vertical: {
    effects: "fadeIn",
    duration: 75
  }
}

It had no effect on the open/close animation and caused both the animation and functionality for changing months and years to stop working.

[Georgi Krustev]

Hello Alan,

As I mentioned, the default animations of the Calendar are pretty complex, as they require additional HTML setup before applying the specified effects. That being said, I would suggest you either use the default animations and reduce the duration of the effects execution or just stop the animation at all.

Regards,
Georgi Krustev
Telerik