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

I need to delay more the fade or the animation from one slide to another #1302

Open
2 tasks done
DianyelaMaldonado opened this issue Apr 17, 2024 · 0 comments
Open
2 tasks done
Labels
bug Something isn't working

Comments

@DianyelaMaldonado
Copy link

Checks

Version

4.1.4

Description

I need the fade to be less fast, I need the time to change from one slide to another to be slower, so that the animation feels smooth

This is my code: ("speed" property does not work)


export default () => ({
  Slider: null,
  init() {
    this.Slider = new Splide(this.$refs.carousel, {
      type: "fade",
      perPage: 1,
      pagination: true,
      arrows: true,
      transition : 'ease-in-out',
    });

    this.Slider.mount();

    const fadeElements = document.querySelectorAll('.splide__slide');
    fadeElements.forEach(element => {
      element.style.transitionDuration = '4s';
    });
  },
});

Reproduction Link

No response

Steps to Reproduce

"speed" property does not work

Expected Behaviour

I need the fade to be less fast, I need the time to change from one slide to another to be slower, so that the animation feels smooth

@DianyelaMaldonado DianyelaMaldonado added the bug Something isn't working label Apr 17, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant