Javascript 项目符号导航中的jssor滑块错误
您好,我使用jssor slider在易趣模板中制作滑块这是我第一次使用它。所以我只是在当地进行练习。滑块工作正常,但当我添加bullet navigator时,它显示以下错误Javascript 项目符号导航中的jssor滑块错误,javascript,jquery,html,css,jssor,Javascript,Jquery,Html,Css,Jssor,您好,我使用jssor slider在易趣模板中制作滑块这是我第一次使用它。所以我只是在当地进行练习。滑块工作正常,但当我添加bullet navigator时,它显示以下错误 Uncaught Error: Navigator item prototype not defined. 这是我到目前为止的代码 <script src="jssor.js"></script> <script src="jssor.slider.js"></scrip
Uncaught Error: Navigator item prototype not defined.
这是我到目前为止的代码
<script src="jssor.js"></script>
<script src="jssor.slider.js"></script>
<script>
jssor_slider1_starter = function (containerId) {
var options = {
$BulletNavigatorOptions: {
$Class: $JssorBulletNavigator$,
$ChanceToShow: 2
}
};
var jssor_slider1 = new $JssorSlider$(containerId, options);
};
</script>
</head>
<body>
<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 600px; height: 300px;">
<!-- Slides Container -->
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 600px; height: 300px;">
<div><img u="image" src="blue.jpg" /></div>
<div><img u="image" src="purple.jpg" /></div>
<div><img u="image" src="red.jpg" /></div>
</div>
<!--navication bullets-->
<div u="navigator" class="jssorb01">
1
</div>
<div u="navigator" class="jssorb01">
2
</div>
<div u="navigator" class="jssorb01">
3
</div>
<!--/navigation bullets-->
<!-- Trigger -->
<script>jssor_slider1_starter('slider1_container');</script>
</div>
jssor\u滑块1\u启动器=功能(容器ID){
变量选项={
$BulletNavigatorOptions:{
$Class:$JssorBulletNavigator$,
$ChanceToShow:2
}
};
var jssor_slider1=新的$JssorSlider$(containerId,选项);
};
1.
2.
3.
jssor_滑块1_启动器(“滑块1_容器”);
请给出一个如何在易趣登录模板中使用它的示例…请下载jssor.slider.fullpack.zip,解压缩并找到“skin\bullet-01.source.html” 子弹导航器的皮肤看起来像
<!-- Bullet Navigator Skin Begin -->
<!-- jssor slider bullet navigator skin 01 -->
<style>
/*
.jssorb01 div (normal)
.jssorb01 div:hover (normal mouseover)
.jssorb01 .av (active)
.jssorb01 .av:hover (active mouseover)
.jssorb01 .dn (mousedown)
*/
.jssorb01 div, .jssorb01 div:hover, .jssorb01 .av
{
filter: alpha(opacity=70);
opacity: .7;
overflow:hidden;
cursor: pointer;
border: #000 1px solid;
}
.jssorb01 div { background-color: gray; }
.jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
.jssorb01 .av { background-color: #fff; }
.jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }
</style>
<!-- bullet navigator container -->
<div u="navigator" class="jssorb01" style="position: absolute; bottom: 16px; right: 10px;">
<!-- bullet navigator item prototype -->
<div u="prototype" style="POSITION: absolute; WIDTH: 12px; HEIGHT: 12px;"></div>
</div>
<!-- Bullet Navigator Skin End -->
/*
.jssorb01分区(正常)
.jssorb01分区:悬停(正常鼠标悬停)
.jssorb01.av(活动)
.jssorb01.av:悬停(活动鼠标悬停)
.jssorb01.dn(鼠标向下)
*/
.jssorb01 div、.jssorb01 div:hover、.jssorb01.av
{
过滤器:α(不透明度=70);
不透明度:.7;
溢出:隐藏;
光标:指针;
边框:#000 1px实心;
}
.jssorb01 div{背景色:灰色;}
.jssorb01 div:hover.jssorb01.av:hover{背景色:#d3d3;}
.jssorb01.av{背景色:#fff;}
.jssorb01.dn、.jssorb01.dn:悬停{背景色:#555555;}
hi您还可以演示如何在易趣中使用此滑块,一个脚本。当滑块位于易趣模板中时,我对如何加载滑块感到困惑。。