Stepper progressbar

[Eric]

I'm using the stepper and i don't want to display the progressbar animation since my page is reloading every 30 seconds, and it's anoying.

i tried a couple things like:

@(Html.Kendo().Stepper()
    .Name("stepper")
    .Animation(false) // Disable animation
    .Steps(s =>
    {
        s.Add().Label("First Step");
        s.Add().Label("Second Step").Selected(true);
        s.Add().Label("Last Step").Icon("save");
    })
)

also with css:

.k-stepper .k-stepper-content {
    transition: none !important;
}

also with javascript:

$(document).ready(function() {
    kendo.fx($("#stepper")).disable();
});

$(document).ready(function() {
    var stepper = $("#stepper").data("kendoStepper");
    stepper.options.animation = false;
});

Nothing is working.

i' trying to make it work in Telerik Dojo : Kendo UI Dojo

Any idea how to remove the animation?

 

 

 

 

 

 

 

 

 

[Martin]

Hello, Eric,

The Stepper doesn't expose an animation option which can be disabled. The animation is coming from the integrated ProgressBar, so you can get a reference to it through the stepper instance, and use the setOptions method to disable the animation.

var stepper = $("#stepper").data("kendoStepper");
      stepper.progressBar.setOptions({
        animation: false,
      });

Here you will find a small Dojo example for reference.

Let me know if that would work for you.

Regards,
Martin
Progress Telerik

[Eric]

Thanks, seem to work perfectly