Streaming live at 10am (PST)

Want to use 2 triggers for 1 (connected) slider

Hey guys,

I have a website where I use the tutorial of @samliew (http://webflow-tricks.webflow.io/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