I'm currently facing a challenge with an outdated element like <marquee>. Here's a fiddle where you can check it out: https://jsfiddle.net/qbqz0kay/1/
This is just one of the many attempts I've made, and I'm struggling with two main issues:
- How can I eliminate the gap between the end and the beginning of the list (aiming for a smooth, infinite scrolling effect)? I've experimented with removing the first
lielements and adding them to the end, but it ended up affecting the overall dimensions of the list and disrupting the animation. - Another complication arises from the fact that part of the list will change periodically (via websocket updates), leading to shifts in the list's dimensions. Consequently, this results in animation stuttering issues.
Does anyone have any suggestions on how I can tackle these challenges? I've looked at various examples online, but none seem to address these specific concerns.