javascript - JSSOR 'thumbnavigator' 错误原型(prototype)未定义

Question

我正在尝试在我的页面上实现 JSSOR slider ，但我仍坚持使用拇指导航。添加 u="thumbnavigator" 后，我不断收到以下错误到我的标记:

Error: Error: prototype of 'thumbnavigator' not defined. Script: [...] Line: 69 Column: 14 StackTrace: Error: prototype of 'thumbnavigator' not defined.

定义应该足够，而不是问题:

<div u="thumbnavigator" style="position:absolute; width:600px; height:120px;" class="slider-thumbs">
</div>

这是我初始化 slider 的方法:

        var options = {
            $DragOrientation: 1,
            $ArrowNavigatorOptions: {
                $Class: $JssorArrowNavigator$,
                $ChanceToShow: 2
            },
            $ThumbnailNavigatorOptions:  {
                $Class: $JssorThumbnailNavigator$,           
                $ChanceToShow: 2,                              

                $Loop: 0,                                     
                $SpacingX: 3,                                  
                $SpacingY: 3,                                  
                $DisplayPieces: 4,                               
                $ArrowNavigatorOptions: {
                    $Class: $JssorArrowNavigator$,             
                    $ChanceToShow: 2,                              
                    $AutoCenter: 2,                                
                    $Steps: 3                                    
                }
            }
        };
        console.log($JssorThumbnailNavigator$);
        console.log($('#slider-main'));
        var jssor_slider1 = new $JssorSlider$("slider-main", options);

在我的控制台中提供以下内容，这对我来说完全正确:

function(elmt, options)
Object[div#slider-main.slider]

我还有一个 <img u="thumb" />以及 <img u="image" />在我的幻灯片标记中，它们都指向有效的图像资源(使用 firebug 检查)。

有人可以指出我正确的方向吗？任何帮助表示赞赏:)

Answer 1

Jssor 缩略图导航器 html 代码看起来像，

<!-- ThumbnailNavigator Skin Begin -->
<div u="thumbnavigator" class="jssort07" style="position: absolute; width: 800px; height: 100px; left:0px; bottom: 0px;">
    <!-- Thumbnail Item Skin Begin -->
    <style>
        /* css here */
    </style>
    <div u="slides" style="cursor: move;">
        <div u="prototype" class="p" style="POSITION: absolute; WIDTH: 72px; HEIGHT: 72px; TOP: 0; LEFT: 0;">
            <div u="thumbnailtemplate" class="i" style="position:absolute;"></div>
            <div class="o">
            </div>
        </div>
    </div>
    <!-- Thumbnail Item Skin End -->
</div>
<!-- ThumbnailNavigator Skin End -->

“skin/thumbnail-*.source.html”包中有一些缩略图导航器皮肤