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

pause(), play() methods are not working? #15

Open
2 tasks done
kumardeepakme opened this issue Jan 9, 2024 · 6 comments
Open
2 tasks done

pause(), play() methods are not working? #15

kumardeepakme opened this issue Jan 9, 2024 · 6 comments
Labels
bug Something isn't working

Comments

@kumardeepakme
Copy link

kumardeepakme commented Jan 9, 2024

Checks

Version

v0.5.3

Description

Methods of splide-extension-auto-scroll are not working. Below is sample code for reference.

NOTE:
@splidejs/splide = 4.1.4
@splidejs/splide-extension-auto-scroll = v0.5.3

import { Splide } from "@splidejs/splide";
import { AutoScroll } from "@splidejs/splide-extension-auto-scroll";

const carousel = new Splide(document.querySelector(".splide"), {
  type: "loop",
  gap: "20px",
  drag: "free",
  pagination: false,
  arrows: false,
  autoScroll: {
    speed: -0.5,
    pauseOnHover: false,
    pauseOnFocus: false,
  },
});
carousel.mount({ AutoScroll });

// !!! NOT WORKING !!!
/** Should ideally pause the carousel, but it is not?? */
carousel.Components.AutoScroll.pause();

Reproduction Link

https://codesandbox.io/p/devbox/splide-autoscroll-issue-cgg4v4

Steps to Reproduce

N/A

Expected Behaviour

Should pause & play with respective methods.

@kumardeepakme kumardeepakme added the bug Something isn't working label Jan 9, 2024
@kumardeepakme
Copy link
Author

Any update on this issue? @NaotoshiFujita OR @korneliusz-buczkowski-lemisoft

@kumardeepakme
Copy link
Author

is this project dead or what? 😡

@natirivero
Copy link

I think it is because you are calling it inmediately after mounting it, I replicated your issue but then wrapped inside a setTimeOut function and it worked

`function createSlider() {
var splide = new Splide('.splide', {
type: 'loop',
drag: 'free',
focus: 'center',
direction: 'ttb',
height: '435px',
arrows: false,
autoScroll: {
speed: 1,
},
});

splide.mount(window.splide.Extensions);

setTimeout(() => {
splide.Components.AutoScroll.pause();
}, 3000);
}
window.addEventListener('DOMContentLoaded', createSlider);`

Maybe if you don't want it to play on load, you should use the intersection extension

@kumardeepakme
Copy link
Author

Why is there a need to employ setTimeout for running the methods? It should be the default functionality, especially when it's already loading after DOMContentLoaded. Regardless, I have decided not to use Splide anymore. 🙏

@natirivero
Copy link

natirivero commented Feb 26, 2024 via email

@ekkun
Copy link

ekkun commented Mar 19, 2024

I also couldn't use those methods, so I used useToggleButton instead. 😛

autoScroll: {
  useToggleButton: true
}

https://codepen.io/ekkun/pen/ExJZbGQ

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

3 participants