jssor更改缩略图宽度和高度

Question

我使用Jssor图像滑块和缩略图导航器。我一直在调整类和图像的宽度和高度，但我还没有找到为每个缩略图定义特定宽度和高度的方法。我不需要每个缩略图的大小不同，但我想使用的大小与演示不同

非常感谢您的帮助。我发现很难自定义这个滑块及其元素的大小

Answer 1

给定缩略图导航器（skin\thumbnail-01.source.html）如下，

    <!-- Thumbnail Navigator Skin Begin -->
    <div u="thumbnavigator" class="jssort01" style="position: absolute; width: 800px; height: 100px; left:0px; bottom: 0px;">
        <!-- Thumbnail Item Skin Begin -->
        <style>
            /* jssor slider thumbnail navigator skin 01 css */
            /*
            .jssort01 .p           (normal)
            .jssort01 .p:hover     (normal mouseover)
            .jssort01 .pav           (active)
            .jssort01 .pav:hover     (active mouseover)
            .jssort01 .pdn           (mousedown)
            */
            .jssort01 .w
            {
                position: absolute;
                top: 0px;
                left: 0px;
                width: 100%;
                height: 100%;
            }
            .jssort01 .c {
                position: absolute;
                top: 0px;
                left: 0px;
                width: 68px;
                height: 68px;
                border: #000 2px solid;
            }
            .jssort01 .p:hover .c, .jssort01 .pav:hover .c, .jssort01 .pav .c {
                background: url(../img/t01.png) center center;
                border-width: 0px;
                top: 2px;
                left: 2px;
                width: 68px;
                height: 68px;
            }
            .jssort01 .p:hover .c, .jssort01 .pav:hover .c {
                top: 0px;
                left: 0px;
                width: 70px;
                height: 70px;
                border: #fff 1px solid;
            }
        </style>
        <div u="slides" style="cursor: move;">
            <div u="prototype" class="p" style="position: absolute; width: 72px; height: 72px; top: 0; left: 0;">
                <div class=w><thumbnailtemplate style="width: 100%; height: 100%; border: none;position:absolute; top: 0; left: 0;"></thumbnailtemplate></div>
                <div class=c>
                </div>
            </div>
        </div>
        <!-- Thumbnail Item Skin End -->
    </div>
    <!-- Thumbnail Navigator Skin End -->

您可以在上面的代码中更改大小（68px，70px，72px）。