animxyz

animxyz copied to clipboard

Just an FYI, getting lots of rough animations because the right panel occasionally overflows and shows a horizontal scrollbar which ruins the otherwise slick effects.

One such spot this element: <XyzTransitionGroup appear tag="ul" class="chat-list list--no-style" duration="auto">

Setting overflow to hidden makes the chat example smooth.

For the record, using Chrome Version 95.0.4638.69 (Official Build) (x86_64).

p.s. Awesome library and glad to have found it. And if you get to the point where you'd like to support an Angular library as part of this repo and could use some assistance, let me know. Cheers.

Thanks for the kind words @arimus! We would definitely like to support Angular, although neither of us are very familiar with its element transition system. Open to ideas and contributions there!

Regarding the overflow on the right panel, can you tell me what resolution/width you are viewing the page at when it happens? Also do your scrollbars autohide or are they always visible when available?

On a MacBook Retina first gen (2880 x 1800), with Chrome full screen. The scrollbars only show up for a fraction of a second (e.g. they flash in and then back out). Generally, I've seen this when there is temporary overflow during rendering for one reason or another.

Btw, here's what it looks like - 1MB Video

Re: Angular, I'll take a look. I've integrated the basics into my app already.

p.s. Love the docs and animation builder examples in there. It might also be nice to provide a mechanism for some more common animations / chained animation out-of-the box (e.g. https://animate.style/)