Changing the thumbnail scroller position

The orientation of the thumbnail scroller can be set to 'Horizontal' or 'Vertical'. When the orientation is horizontal, the scroller is positioned below the slider, and when the orientation is vertical, the scroller is positioned to the right of the slider. If you want to place the scroller above or to the left of the slider, you will need to use some custom CSS code.

1. Thumbnail scroller above the slider

.my-slider .thumbnail-scroller.horizontal {
    margin-top: 0;
    top: 0;
}
     
.my-slider .slider-main {
    padding-top: 100px;
}

2. Thumbnail scroller to the left of the slider

.my-slider .thumbnail-scroller.vertical {
    margin-left: 0;
    left: 0;
}
     
.my-slider .slider-main {
    padding-left: 200px;
}

The padding you set for the '.slider-main' element depends on the size of the thumbnail scroller. You might need to set it to a lower or higher value.

Have more questions? Submit a request

0 Comments

Article is closed for comments.
Powered by Zendesk