search

davidjerleke / embla-carousel

A lightweight carousel library with fluid motion and great swipe precision.
https://www.embla-carousel.com
MIT License
5.49k stars 167 forks source link

Scale artifacts when dragging with mouse #398

Closed thdoan closed 1 year ago

thdoan commented 1 year ago

Bug is related to

Embla Carousel version

Describe the bug

Steps to reproduce

  1. Go to https://codesandbox.io/s/embla-carousel-scale-vanilla-gc3b0
  2. Slowly drag a slide left or right using the mouse.
  3. Artifacts in screenshot above are visible.

Expected behavior

davidjerleke commented 1 year ago

Hi @thdoan,

Thanks for your bug report. What do you mean by artifacts? That the other slides are visible while sliding between two slides? Or do you mean that you’re seeing some rendering glitches?

If yes to the latter:

Kindly, David

thdoan commented 1 year ago

@davidjerleke I'm referring to the redraw glitches:

image

Device: Windows 10 desktop Browser: Chrome Version 107.0.5304.107 (Official Build) (64-bit)

No, I cannot reproduce it on the documentation example, only in the sandbox with the white background.

davidjerleke commented 1 year ago

Hi again @thdoan,

Thanks for the additional details. At the time of writing, the CodeSandboxes are static and there are differences between the documentation website examples and the CodeSandboxes (including the scale example of course). The CodeSandboxes need manual updates so they are out of sync with the documentation examples.

I’m working on creating the CodeSandboxes dynamically so they will share the exact same code as the documentation website examples in the near future:

I guess I’ve fixed the rendering problems you describe on the documentation website (which are browser rendering problems to be clear) but not in the CodeSandbox example. It should be a matter of adding something along these lines to the slide CSS. Try that and if it doesn’t solve your problem the dynamical CodeSandbox feature probably will.

Best, David

thdoan commented 1 year ago

@davidjerleke thank you for the explanation. Adding the CSS fixed it, so closing.