I have two Jssor "nearby-image-partial-visible-slider" on the same page and I would like them to swipe/move in the same time. Is this possible? Can somebody tell me how can I achieve this?
Thank you!
var jssor_slider1 = new $JssorSlider$(...;
//set $AutoPlay: false for the second slider
var options2 = {
...,
$AutoPlay: false,
...
}
var jssor_slider2 = new $JssorSlider$("slider2_container", options2);
function OnPositionChange(position) {
//let jssor_slider2 go to the same position as jssor_slider1
jssor_slider2.$GoTo(position);
}
//listen $JssorSlider$.$EVT_POSITION_CHANGE on jssor_slider1
jssor_slider1.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnPositionChange);
To make slider1 swipe along with slider2
var jssor_slider1 = new $JssorSlider$(...;
var jssor_slider2 = new $JssorSlider$(...;
function OnPositionChange(position) {
//let jssor_slider1 go to the same position as jssor_slider2
jssor_slider1.$GoTo(position);
}
//listen $JssorSlider$.$EVT_POSITION_CHANGE on jssor_slider2
jssor_slider2.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnPositionChange);
Edit:
var jssor_slider1 = new $JssorSlider$(...;
var jssor_slider2 = new $JssorSlider$(...;
function OnPositionChange(position) {
jssor_slider1.$GoTo(position);
jssor_slider2.$GoTo(position);
}
jssor_slider1.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnPositionChange);
jssor_slider2.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnPositionChange);
To make slider1 swipe along with slider2
Edit: