Masterslider – How to synch two sliders

2 Views

I wish to display two sliders on the website that move in sync when I swipe through them. I am using the masterslider plugin. One way to do this is to give each slider a variable and then use a function on it.

Here is the code that I added in the slider init callback:

Read More
function(event){
    var api = event.target; 
    var firstSlider = masterslider_instances[0]; 
    var secondSlider = masterslider_instances[1];

    firstSlider.api.view.addEventListener(MSViewEvents.SCROLL, function() {  
        secondSlider.api.view.controller.changeTo(firstSlider.api.view.controller.value);
    });
}

This code is not fully effective as the second slider fails to show slide 2, 3, etc. What am I missing? Is there an easier way? Here is the test site: http://siegristpartner.com/w2

Many thanks.

Post Views: 2

Related posts