marchbox/monorail

Monorail animation is still janky

Closed this issue · 1 comments

A few things to try:

  • Wait for land-inlinesvg to be defined and loaded before defining other custom elements
  • Wait for land-monorail to hydrate before kicking in the arrival animation

The jankiness probably comes from the way the animation used to be set up: no controlled timing for animation to start, the .monorail-train element had animation CSS rule added as CSS is load. This doesn't necessarily mean the DOM is ready for animation. So the animation could cause the train's position to be unstable. This was especially an issue on small screens when you have to horizontally scroll the train to reveal more navigation items.

Switching to using transition instead animation seems to mitigate the issue quite a bit.