basilio / responsiveCarousel

Simple carousel
MIT License
113 stars 64 forks source link

clicking on next/previous rapidly does not move smoothly, but buffers and pauses causing a poor appearance #53

Open retrogradeorbit opened 6 years ago

retrogradeorbit commented 6 years ago

If you click rapidly on next and previous, the scrolling does not smoothly move to the destination image. Instead it queues up the clicks and applies them one at a time, with pauses in between, which is less than ideal and looks really clunky.

For example, if I quickly click, next, next, next, next, prev, prev, instead of just scrolling smoothly two to the right, it scrolls one right, pauses, one right, pause, one right, pauses, one right, pause, one left, pause, one left.

This is because your implementation of the scrolling logic is very naive. The better approach to implementation is to keep a counter 'destination_tile', and when you click next and previous, you alter that number. Then, completely separately to the next/previous click handling, you implement an asynchronous function that looks at the present tile the view is on, and the destination tile, and then smoothly transitions to that tile.

You can deal with the tile looping by allowing the present_tile, and destination_tile numbers to freely increase from negative infinity to positive infinity, and then use a modulus to work out where in the loop the display should be.