Animations on expand and collapse in treegrid

Hi there,

I would like to have some sliding animations on expand and collapse in a treegrid component we are using.

Similar to the sliding animations we use in the treeview and accordion components.

I'm looking for something like this (https://www.syncfusion.com/forums/168609/change-expand-collapse-animation-css-settings ), but I'm struggling to find information on how to do it in the treegrid from the docs.

Thanks,

Arthur


1 Reply

PS Pon Selva Jeganathan Syncfusion Team September 6, 2022 05:08 AM UTC

Hi Arthur,  

 

Thanks for contacting syncfusion forum.

 

Query: I would like to have some sliding animations on expand and collapse in a treegrid component we are using.

 

We achieved your query by using the CSS styles.

 

Please refer to the below code example,

 

<style>

  .e-treegrid .e-treegridexpand,

.e-treegrid .e-treegridcollapse {

  width: 18px;

  animation-name: example;

  animation-duration: 10s;

 

}

 

@@keyframes example {

from {background-color: red;}

to {background-color: yellow;}

}

</style>

 

 

Please refer to the below screenshot,

 

 

 

If the above solution, does not meet your requirement kindly share the detailed explanation of your requirement, confirm whether you want to show the animation while the expand/collapse operation is performed or show the animation on the initial render. and video demo/screenshot of your requirement to proceed further.

 

Kindly get back to us for further assistance.

 

Regards, 

Pon selva  


Loader.
Up arrow icon