react-slick icon indicating copy to clipboard operation
react-slick copied to clipboard

Item gets stuck off-center while scrolling vertically/diagonally

Open wgolledge opened this issue 5 years ago • 6 comments

I've spotted an issue where the item gets stuck off-center when you swipe upwards as well as horizontally.

As you can see the card gets stuck to the side when scrolling vertically as well as horizontally.

This same example can be replicated on the example given on https://react-slick.neostack.com/ - though it's harder to notice because of the lack of padding.

Expected outcome:

The card should bounce back to the center, as it normally does, when swiping vertically combined with horizontally.

wgolledge avatar May 17 '19 18:05 wgolledge

have same problem

Kshinight avatar Oct 20 '19 07:10 Kshinight

Same problem here with the official demo https://codesandbox.io/s/react-slick-playground-kdme2

ezgif-6-561d25e6e83e

The trick to reproduce this issue is dragging an item and instantly releasing the mouse once the left item appears.

edwardfxiao avatar Feb 27 '20 08:02 edwardfxiao

ok, found the solution. Just wrap one more div to the tag.

original code

<Slider {...settings}>
          <div>
            <img src="http://placekitten.com/g/400/200" />
          </div>

working code:

<Slider {...settings}>
          <div>
            <div>
              <img src="http://placekitten.com/g/400/200" />
            </div>
          </div>

edwardfxiao avatar Feb 27 '20 08:02 edwardfxiao

Nice spot. Strange bug

wgolledge avatar Feb 27 '20 17:02 wgolledge

strange , working for me as well , thanks

sandeepdhobi avatar Mar 18 '20 11:03 sandeepdhobi

not working

kwanso-hassanlatif avatar Jun 14 '23 06:06 kwanso-hassanlatif