Accordion animation

[Joost]

When I set the [animation]=”‘none'”, I still get the ripple effect when clicking an accordion item.

I can’t seem to find any other property to disable it. What am I missing?

[admin]

Hi Joost,

The ripple effect is defined with the .smart-ripple CSS class. You can do this:

.smart-ripple {
 animation: none; 
 visibility: hidden;
}

Best regards,
Peter Stoev

Smart UI Team
https://www.htmlelements.com/

[Joost]

Thank you Peter, that worked.

Is this documented anywhere?

 

 

[admin]

Hi Joost,

I prepared it for you. It is not part of official docs.

Best regards,
Peter Stoev

Smart UI Team
https://www.htmlelements.com/

[Kelly Thomas]

Hi, I’m new to this forum and had the same question, so I wanted to share what I found based on the helpful discussion with the developer.

As mentioned by the developer:

Setting [animation]=”‘none'” only disables the open/close animation of the content. The ripple effect is a separate visual effect and isn’t controlled by the animation property.

To remove the ripple effect in Smart Accordion, you can simply add this CSS to your styles:

.smart-ripple {
display: none !important;
}
This completely hides the ripple effect when clicking an accordion item.

It worked perfectly for me — I think it will work for you too!

[Author]

Posts