我正在尝试在我的页面上实现一个JSSOR滑块,但我仍然坚持使用拇指导航。一旦我向我的标记添加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进行检查)。
有人能指出我正确的方向吗?任何帮助表示赞赏:)
答案 0 :(得分:0)
Jssor thumbnail导航器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 -->
包中有一些缩略图导航器皮肤&#39;皮肤/缩略图 - * .source.html&#39;