Carousel: Advancing images too quickly causes image being overlaid

[chromadesign]

Impacted plugin

Jetpack

Steps to Reproduce

1. When images in the carousel are being advanced too quickly, images suddenly get overlaid with a semitransparent color.
2. Only after opening and closing the carousel, it goes back to normal. I can't see any CSS causing the bug.
3. Probably only in Chrome and Edge as far as I could verify.

A clear and concise description of what you expected to happen.

Images advancing normally

What actually happened

Images being overlaid

Other information

This not only happens on my site but can be reproduced on the official demo here as well: https://jetpack.com/support/carousel/ (I get a black overlay, here it's kind of greenish).

Operating System

Windows

OS Version

10

Browser

Chrome/Chromium, Microsoft Edge

Browser Version(s)

102.0.5005.63

[jeherve]

Thanks for the report!

Is there a chance you could record a little video of yourself doing this? I've tried to recreate the problem on that Carousel support page using Chrome 102.0.5005.61, but I cannot get the images to slide too quickly; if I click very quickly, the images just don't slide as quickly as my clicks.

Thank you!

[chromadesign]

Here are two videos showing the bug on both the support page as well as my own site. Hope it helps :) https://user-images.githubusercontent.com/18714537/174829940-3e0cd44b-6fc3-46c3-afc5-9059d5eea3b5.mp4 https://user-images.githubusercontent.com/18714537/174830441-cb565d43-dd76-4526-9fe5-2faf788a17ff.mp4

[jeherve]

Thank you! After some more tries, I saw that effect on the last image of the Carousel page. 👍

[bindlegirl]

Reported here as well: p8oabR-Vp-p2#comment-6546