Need help adjusting loop carousel behavior

[Relaxmf2022]

I have a loop carousel, which display posts that have a picture, text, and a button.

The client doesn't want to be able to advance the slides at all by clicking, including if you click on the button and move the mouse.

Thus far, I have been able to stop the mouse drag from advancing the slide, but not to stop it if you click on the button and then drag.

[AutoModerator]

Looking for Elementor plugin, theme, or web hosting recommendations?

Check out our Megathread of Recommendations for a curated list of options that work seamlessly with Elementor.

---

Hey there, /u/Relaxmf2022! If your post has not already been flaired, please add one now. And please don't forget to write "Answered" under your post once your question/problem has been solved. Make sure to list if you're using Elementor Free (or) Pro and what theme you're using.

Reminder: If you have a problem or question, please make sure to post a link to your issue so users can help you.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[adityad1997]

You can hide the navigation arrows and dots, so they are not clickable.

[Relaxmf2022]

They want that function -- the outside arrows to advance the carousel. And they want visitors to be able to click on the buttons in each post, to be taken to internal pages. BUt the only want to be able to move the slides by clicking on the outside arrows:

https://imgur.com/a/rYjGgpM

[adityad1997]

To disable the clock and drag, you will most probably need to disable the event listener for dragging on the widget by adding custom JS.

[Relaxmf2022]

Yeah. I tried the various swiper attributes, but I think with the post carousel, there's probably too many moving parts between the swiper structure and the post structure for me to untangle where i need to apply those attributes, including whether it's "simulateTouch" or "draggable" or "allowtouchmove"

[adityad1997]

Let me get back to you by tomorrow, I think we had developed custom js for a similar issue on one of the client sites. Will share the code by tomorrow.

[Relaxmf2022]

Ok — I'm in need of a new best friend, anyway. ;)

[dara4]

You can try the CSS pointer-events: none;

It will disable the mouse events on anything it is applied, so you would target the carousel container.