search

megasanjay / vue3-marquee

A simple marquee component with ZERO dependencies for Vue 3.
vue3-marquee.vercel.app
MIT License
537 stars 18 forks source link

`on-loop-complete` is out of sync with real animation #355

Open Beaterie opened 1 week ago

Beaterie commented 1 week ago

Describe the bug OnLoopComplete event fails triggering at the right time when a delay prop is used or the animation is paused in between.

To Reproduce Steps to reproduce the behavior:

  1. Define a delay > 0
  2. Give @on-loop-complete a console log (or with via an external ref and watch with console log) OR trigger the paused property during the animation via a button e.g.
  3. See in console the triggered log which doesn't fit to the moment of the loop. Event is not connected to the real animation status.

Expected behavior OnLoopComplete should consider both, a defined delay but also a pause in the animation. So far it only depends on a TimeOut which leads to a misalignment of the OnLoopComplete event with the real animation. In this context, the event is useless right now.

Desktop (please complete the following information):

Additional context Add any other context about the problem here.

megasanjay commented 6 days ago

I had planned to use the x/y position on the page to rework the loop counter but this runs into the same issue with breaking the counter flow. I will try to rework this soon so that it is more accurate.