Question

The company I work for is considering replacing jQuery UI with Kendo UI.
I personally don’t see any benefits and I also find the documentation of Kendo UI severely lacking.

For instance, in jQuery UI, there are these nice class transition effects: http://jqueryui.com/docs/Effects/Methods#Class_Transitions

What are the Kendo UI equivalents of these effects?

Answer 1

There are kendoAddClass, kendoRemoveClass and kendoToggleClass in kendo.fx.js which use CSS3 transitions when available and fall back to direct replace when not. They are not documented yet because the animation is done directly with CSS and can be stopped only by removing the transition from the element.

After a check it seems the jQuery plugins got broken in Q2 2012 (build 710). I’ve fixed them and the fix will be out with the service pack next week. Meanwhile you can still use the kendo.toggleClass() method that used to power them. Its usage is like this:

kendo.toggleClass(element, classes, options, toggle);

element: jQuery object
classes: one or more classes to apply (separated by a space)
options: {
    exclusive: "all",
    duration: 400,
    easing: "ease-out"
} - options is optional, can be omitted, the values up there are default and fed to the transition CSS property, duration is in ms.
toggle: add/remove the class.

As of the service pack next week you can use it directly like this:

$("#test").kendoAddClass(classes, options);

Oh, forgot to add a jsBin demo