Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: When scrolled to last item, click anywhere returns carousel to previous page of slides #243

Closed
jorgvm opened this issue Jul 17, 2018 · 8 comments
Labels
bug good first issue This issue is good for a new vue developer! help wanted

Comments

@jorgvm
Copy link
Contributor

jorgvm commented Jul 17, 2018

Hi,

Let's say you always show 3 items per slide, and you have 4 items in total. If you show the 4th item, and then click anywhere on the slider, it will return to show the 1/2/3 items.

Here is an example:
https://jsfiddle.net/mfvcu82y/

This is strange, and does not happen if you had 5 items in total:
https://jsfiddle.net/mfvcu82y/3/

I would like to be able to turn his bug/feature off please!

great slider otherwise, thanks 👍

@quinnlangille
Copy link
Member

Hey @jorgvm, this is definitely a bug. No idea what could be causing it at first glance, so will take some investigation. If you happen to find a workaround, feel free to make a PR or post your solution here :~)

Thanks for reporting, I'll flag this as a bug fix and see if we can get some contributor traction.

@quinnlangille quinnlangille added bug help wanted good first issue This issue is good for a new vue developer! labels Jul 17, 2018
@quinnlangille quinnlangille changed the title Click returns to previous itemgroup Bug: Clicking on last item returns carousel to previous page of slides Jul 17, 2018
@quinnlangille quinnlangille changed the title Bug: Clicking on last item returns carousel to previous page of slides Bug: When scrolled to last item, click anywhere returns carousel to previous page of slides Jul 17, 2018
@raynox
Copy link

raynox commented Aug 28, 2018

Hey, something wrong happens here:

    render() {
      // add extra slides depending on the momemtum speed
      this.offset +=
        Math.max(
          -this.currentPerPage + 1,
          Math.min(Math.round(this.dragMomentum), this.currentPerPage - 1)
        ) * this.slideWidth;

      // & snap the new offset on a slide or page if scrollPerPage
      const width = this.scrollPerPage
        ? this.slideWidth * this.currentPerPage
        : this.slideWidth;
      this.offset = width * Math.round(this.offset / width);

      // clamp the offset between 0 -> maxOffset
      this.offset = Math.max(0, Math.min(this.offset, this.maxOffset));

      // update the current page
      this.currentPage = this.scrollPerPage
        ? Math.ceil(this.offset / this.slideWidth / this.currentPerPage)
        : Math.ceil(this.offset / this.slideWidth);
    },

this.currentPage is being set to 0 and it slides to the first page. This code is so complicated, I don't know why. I'm trying to fix this, but I need to understand this scroll mechanism first.

@quinnlangille
Copy link
Member

Hey @raynox, I agree that the code is really complex. This is by far our most contributed part of the carousel, so it's had many authors and as a result got a little messy. We're planning a refactor of this logic as part of the v1 roadmap, which will hopefully resolve this. However, there's no timeline on that, so if you have a solution feel free to open a PR!

I've opened #274 to discuss the issue. If you have any questions/findings lets pick up the discussion there 👨‍💻

@nebez
Copy link

nebez commented Nov 1, 2018

@jorgvm @raynox - we've just published @saschwartz's fix for this issue as v0.16.0-rc2 if you're feeling up for the latest unstable version.

@quinnlangille I'm marking this issue as resolved and we can continue the discussion in #274.

@nebez nebez closed this as completed Nov 1, 2018
@eliamartani
Copy link

I'm using version v0.18 and this issue still happens.

https://codepen.io/eliamartani/pen/XQyWOP

Should I open a new issue for it?

@andrewsmith1996
Copy link

I'm using version 0.18.0 and still getting this issue. Has anything been done to fix this?

@BeomyeonAndrewKim
Copy link

It still happens now. with ver 0.18.0

@raditia
Copy link

raditia commented Feb 27, 2020

Experiencing same on 0.18.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug good first issue This issue is good for a new vue developer! help wanted
Projects
None yet
Development

No branches or pull requests

8 participants