Animation -problems

Always when i am working with animations, i get some problems.
Animations are not consistent and sometimes broke or get weird


In this video you can see the behaviour of showing and expanding several strips and hiding and collapsing again.

Elements right from the top:

  1. strip0
  2. strip3
  3. strip6
  4. strip4

Working code:

let animOptions = {"duration":200, "delay":100, "direction":"top"}

export async function BTNsettings_click(event) {
         await $w('#strip3, #strip4, #strip6').hide('float', animOptions)
         await $w('#strip3, #strip4, #strip6').collapse().then(()=>{
            $w('#strip1').expand(), $w('#strip1').show('float', animOptions)
     else {
         await $w('#strip1').hide('float', animOptions).then(()=>{$w('#strip1').collapse()}); 
         $w('#strip3, #strip4, #strip6').expand(), $w('#strip3, #strip4, #strip6').show('float', animOptions)

Also tried other variations, but all without succes to get a proper animation.

The red marked part is the problematic one, which causes little inconsistant animations.
You can see for a split second, some elements poping up again, when hiding and collapsing elements.

Not sure if this is now an Velo-issue or Wix-issue (or even my own :laughing:).

Problem solved by recoding.
But it is still an animation-problem (on my opinion).
There are unpleasant side effects with animation (should be fixed).