NO BUG: Class change on "listening" elements delayed

In recent versions ob Bricks Builder the class change of “listening” html elements, for example in case of the accordeon, is very delayed. Previously, when using the accordeon element for example, the class “brx-open” was added right after clicking the accordeon in order for it to open.

Now the class “brx-open” is only added after the accordeon is fully opened. As I use the classes for styling like animations, this makes it look pretty odd.

Here’s a comparison video (old vs new): https://www.youtube.com/watch?v=vZ0Cb4W6Gow

I am not sure if this is intended, is there any way to make it behave like on older bricks versions?
Thanks in advance!

If anyone is interested, I actually found a solution. Use the following JavaScript to add a new class upon click:

document.querySelectorAll(‘.accordion-title-wrapper’).forEach(header => {
header.addEventListener(‘click’, function() {
var parentElement = this.closest(‘.brxe-block.listening’);
if (parentElement) {
parentElement.classList.toggle(‘insta-open’);
}
});
});

Maybe this new behaviour could be thought about still, as the instant add of the class is way more useful in my opinion, especially for animation purposes.

Hi @kulkreate,

Welcome to the forum :slight_smile:

You can adjust the transition time in the accordion settings:

If you set it to “0” then “brx-open” should be added immediately.

Thanks @charaf

while this is true, this also means that the animation speed of the accordeon expansion is adjusted accordingly. So setting it to a very low transition also means that the opening or closing animation will be extremely fast or non existant.

Maybe you could also work around that in some way to achieve both goals of (1: opening animation) and (2: text fade-up & indicator icon rotation) but for me, the custom js solutions suits my case the best.

Still, thanks a lot and have a nice weekend :slight_smile:

1 Like

Hi @kulkreate,

I hope you had a great weekend :slight_smile:

Ah okay, I see what you mean now. I’ll set this thread as a “how-to” so that other users can find your solution more easily.

Hi @kulkreate ,

We’ve improved this in Bricks 1.12 BETA, now available as a manual download (Bricks – Account)

Please let us know if you are still experiencing issues.

You can see the full changelog here: Bricks 1.12 Changelog – Bricks

As with any beta release, please do not use it on a production/live website. It is only meant for testing in a local or staging environment.

Now .brx-open is added or removed immediately after the user clicks.

Best regards,
Matej