TARKUS
TARKUS

Reputation: 2200

How to make JSSOR Slider Thumbnail Navigation rotate

I'm getting the hang of the ThumbnailNavigationOptions.

What I want to happen is to have the thumbnails move to the right, like they do in this demo:

moving thumbnails

On my page, everything looks like it's working, but the thumbnails don't move:

not moving thumbnails

All of my code is in the html source, but here is my ThumbnailNavigatorOptions script:

ThumbnailNavigatorOptions: {
            $Class: $JssorThumbnailNavigator$,
            $ChanceToShow: 2,
            $Lanes: 1,
            $Loop: 3, //[Optional] Enable loop(circular) of carousel or not, 0: stop, 1: loop, 2 rewind, default value is 1
            $SpacingX: 3, //[Optional] Horizontal space between each thumbnail in pixel, default value is 0
            $SpacingY: 3, //[Optional] Vertical space between each thumbnail in pixel, default value is 0
            $DisplayPieces: 12, //[Optional] Number of pieces to display, default value is 1
            $AutoCenter: 1
        }

If there is anything missing in my code or explanation, please ask.

Upvotes: 1

Views: 614

Answers (1)

jssor
jssor

Reputation: 6985

If you replace '$DisplayPieces: 12' with '$DisplayPieces: 2', you will see it move.

You set $DisplayPieces to 12, and number of slide is totally 3, then the $DisplayPieces decreases to 3.

When $DisplayPieces is equal to or greater than slide count, there is no chance for it to loop. To make it loop/scroll, you should set $DisplayPieces less than slide count.

Upvotes: 3

Related Questions