Center variable width thumbnail strip

zolotoiy's Avatar


12 Sep, 2012 09:27 PM

Hi Dima,
I know that plugin generally doesn't support variable width thumbnails but I almost made it working by modifying CSS:

.rsDefault .rsThumb {
    float: left;
    overflow: hidden;
    height: 72px;
    width: auto;
.rsDefault .rsThumb img {
    height: 72px;
    width: auto;
    opacity: 0.6;
    filter: alpha(opacity=60);

Almost good but now there are two problems:

  • when opening page first it seems that all thumbnails laid over each other, resizing page makes them get into proper positions.

  • shorter strip is not centered anymore and initially selected slide might not be visible on the strip if thumbnails is off screen

Could anything be done about these? See sample

Thanks a lot

  1. 1 Posted by zolotoiy on 12 Sep, 2012 10:45 PM

    zolotoiy's Avatar

    Looks like I found solution to #1 myself by adding this code after slider init:

        setTimeout( function ()
            sliderInstance.updateSliderSize( true );
        }, 200 );


  2. Support Staff 2 Posted by Dmitry Semenov on 13 Sep, 2012 08:16 PM

    Dmitry Semenov's Avatar


    Unforunately, there is no option to make thumbnails different size as getting dimensions of each element is very resource intensive and we need to get size of each thumbnail to make scroller work correctly.

    So without JS code mofications it's not possible to make it work right.


  3. zolotoiy closed this discussion on 16 Sep, 2012 01:49 PM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac