Thumbnails navigation + navigationSize option

[def-media]

Trying to set thumbnails navigation with navigationSize option set to number 2, but there is a problem related to automatic width calculation (or something else). Please, take a look at the demo page http://def-media.hr/test .

[Mottie]

Hi @def-media!

You just need to set the navigation thumbnail size in the css

The following css will keep the thumbnail navigation arrows narrow, but the images wide (demo):

.anythingSlider-default .anythingControls ul span {
    width: 100px;
}

.anythingSlider-default .anythingControls ul a {
    height: 52px;
}​

And this css will make all the navigation buttons the same size:

.anythingSlider-default .anythingControls ul a {
    width: 100px;
    height: 52px;
}​

[def-media]

Hello, Mottie. Thank you very much for your answer, but this does not solve the problem. Please, look again at what is really the problem and how to reproduce the error. The problem is happening on Linux (Firefox and Chrome), I have not tested it on Windows. Thank you once again.

[Mottie]

Hmmm, I think it's because the img size isn't set because if I reload the fiddle it works (thumbnail images get cached). Try including the width and height of the image in the navigation formatter (demo):

navigationFormatter: function(i, panel) {
    // This is the default format (show just the panel index number)
    return '<img width="100" height="47" src="http://def-media.hr/test/images/thumbs/' + ['slide-civil-1', 'slide-civil-2', 'slide-env-1', 'slide-env-2', 'slide-tele-1'][i-1] + '.jpg">';
}

[def-media]

Mottie, thank you very much! Your solution solves my problem.