Hey guys,
I have a website where I use the tutorial of @samliew (How to Sync Webflow Sliders) to connect 2 sliders so they both slide together with one trigger.
Works great! But I want to be able to use 2 triggers to trigger both sliders. Right now I use the arrows from slider 1 to slide through the sliders. But I would like to ALSO use the nav dots from slider 2 to slide through the sliders.
Here a video where you can see the 2 sliders.
(Video link: https://prismic-io.s3.amazonaws.com/uptoday/55a208cf-a412-48a0-84a0-e7af4551b4e3_bug.mp4)
Like in the tutorial, I use this code:
<script>
// On page ready
var Webflow = Webflow || [];
Webflow.push(function() {
// Cache references to nav elements
var sourceNav = $('#sourceNav');
var targetNav = $('#targetNav');
// Every 200ms
setInterval(function() {
// Find the index of source slideNav button's active class
var index = sourceNav.children('.w-active').index();
// Update target slider by triggering a "tap" event on the targetNav corresponding slide button
targetNav.children().eq(index).trigger('tap');
}, 200); // End interval
}); // End ready function
Is there a way to do this?
Thank you!
Here is my site Read-Only:
https://preview.webflow.com/preview/up-microwebsite-5v9?utm_medium=preview_link&utm_source=designer&utm_content=up-microwebsite-5v9&preview=8516ce44bbef1277c233a004d816996a&mode=preview
Here the link to the website:
https://up-microwebsite-5v9.webflow.io/
Password: 9ftqUlKq