1

I have implemented the jssor slider and it mostly works but I discovered a corner case that has me puzzled.

The following variables are involved $StartIndex, $Cols, and $Align.

When $StartIndex is zero, everything works correctly. When the number of images is greater than $Cols, everything works correctly. By that, I mean that all images are displayed and the current image is centered in the thumb display as set by $Align.

When the number of images is less than or EQUAL to $Cols and $StartIndex is not zero, some of the thumbs are hidden off to the left - as if $Align was set to zero.The thumbs can be dragged into position and everything works from then on, but that's obviously not what I want. Here is the code:

    var options = {
    $AutoPlay: false,
    $AutoPlayInterval: 4500,
    $PauseOnHover: 3, //[Optional] Whether to pause when mouse over if a slider is auto playing, 0 no pause, 1 pause for desktop, 2 pause for touch device, 3 pause for desktop and touch device, default value is 1

    $DragOrientation: 3,
    $Loop: false,
    $ArrowKeyNavigation: true,
    $SlideDuration: 300,
    $FillMode: 1,
    $LazyLoading: 5,
    $StartIndex: 3,

    $SlideshowOptions: {
        $Class: $JssorSlideshowRunner$, 
        $Transitions: _SlideshowTransitions,
        $TransitionsOrder: 1,
        $ShowLink: true
    },
    $ArrowNavigatorOptions: {
        $Class: $JssorArrowNavigator$,
        $ChanceToShow: 2
    },
    $ThumbnailNavigatorOptions: {
        $Class: $JssorThumbnailNavigator$,
        $ChanceToShow: 2,
        $ActionMode: 1,
        $SpacingX: 10,
        $Cols: 8,
        $Align: 470
    }
};

var jssor_slider1 = new $JssorSlider$("slider1_container", options);
jssor
  • 6,995
  • 2
  • 18
  • 21
user3200528
  • 63
  • 1
  • 1
  • 8

0 Answers0