Disable animation on init

[bad-shape-guy]

Good afternoon, I recently updated my version from a fairly old one to a new one, and noticed that now when the page is initialized, it's as if all the widgets are in zero coordinates and move to their place with animation

Here you can observe this effect:
https://gridstackjs.com/demo/nested.html

Of course you can disable it with the "animate" parameter, but in this way all animation will be disabled, when dragging, resizing, etc.

The feeling that this did not happen before, i.e. there was animation when moving and changing, but it was not there when initializing, and all widgets were immediately in their place when loading

Please tell me how you can solve my problem. Thanks

[adumesny]

yeah noticed that as well recently. not sure when it started...

[bad-shape-guy]

I think the problem is between releases 8.1.0 and 8.1.1

.grid-stack > .grid-stack-item { position: absolute; top: 0px; left: 0%; padding: 0; }

Attributes top and left break the display of widgets

Although, if you remove these attributes, the animation disappears completely :/

[adumesny]

8.1.1 had a tons of CSS changes #2315 and likely side affect - thanks for narrowing it down the build #
but yeah think this is the issue

[JakubEleniuk]

Can be fixed by removing this line

gridstack.js/src/gridstack.scss

Line 132 in 599965a

@include vendor(transition, left $animation_speed, top $animation_speed, height $animation_speed, width $animation_speed);

[adumesny]

no that removes the entire animation for everything. the problem is on init - maybe fix is to delay setting animation style on the grid until after init... not sure what 8.1.1 change broke this.

[adumesny]

fixed in next release. don't forget to donate if you find this lib useful!