Javascript 嵌入JSSOR滑块

我试图嵌入到我的网站滑块，但我得到的白色方块堆叠3高（3个不同的幻灯片），当我测试它。我是javascript新手，显然错过了一些东西。我希望有一个有3个幻灯片的滑块，可以点击它将用户带到另一个页面。我哪里出错了

Javascript:

 <script src="jssor.slider.min.js"></script>
    <script>
    jssor_slider1_starter = function (containerId) {
        var options = {
            $ArrowNavigatorOptions: {
                $Class: $JssorArrowNavigator$,
                $ChanceToShow: 2
            }
        };
        var jssor_slider1 = new $JssorSlider$(containerId, options);
    };
</script>

jssor\u滑块1\u启动器=功能（容器ID）{
变量选项={
$Arrow导航选项：{
$Class:$JssorArrowNavigator$，
$ChanceToShow:2
}
};
var jssor_slider1=新的$JssorSlider$（containerId，选项）；
};

HTML:

/*jssor滑块箭头导航器皮肤03 css*/
/*
.jssora03l（正常）
.jssora03r（正常）
.jssora03l:悬停（正常鼠标悬停）
.jssora03r:悬停（正常鼠标悬停）
.jssora03ldn（鼠标向下）
.jssora03rdn（鼠标向下）
*/
.jssora03l、.jssora03r、.jssora03ldn、.jssora03rdn
{
位置：绝对位置；
光标：指针；
显示：块；
背景：url（../img/a03.png）无重复；
溢出：隐藏；
}
.jssora03l{背景位置：-3px-33px；}
.jssora03r{背景位置：-63px-33px；}
.jssora03l:悬停{背景位置：-123px-33px；}
.jssora03r:悬停{背景位置：-183px-33px；}
.jssora03ldn{背景位置：-243px-33px；}
.jssora03rdn{背景位置：-303px-33px；}
jssor_滑块1_启动器（“滑块1_容器”）；

我查看了您的页面，发现您在根文件夹中放置了“jssor.slider.mini.js”

因此，正确的参考路径是

<script src="/jssor.slider.mini.js"></script>

或

顺便说一句，“jssor.slider.min.js”和“jssor.slider.mini.js”是相同的，您只需要一个

请删除以下行

<script src="js/jssor.slider.min.js"></script>

编辑：

您没有初始化代码，请添加以下代码

<script>
    jssor_slider1_starter = function (containerId) {
        var options = {
            $DragOrientation: 3,                                //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
            $ArrowNavigatorOptions: {                       //[Optional] Options to specify and enable arrow navigator or not
                $Class: $JssorArrowNavigator$,              //[Requried] Class to create arrow navigator instance
                $ChanceToShow: 2,                               //[Required] 0 Never, 1 Mouse Over, 2 Always
                $AutoCenter: 0,                                 //[Optional] Auto center arrows in parent container, 0 No, 1 Horizontal, 2 Vertical, 3 Both, default value is 0
                $Steps: 1                                       //[Optional] Steps to go for each navigation request, default value is 1
            }
        };

        var jssor_slider1 = new $JssorSlider$(containerId, options);
    };
</script>

jssor\u滑块1\u启动器=功能（容器ID）{
变量选项={
$DRAGORIENTION:3，//[可选]拖动幻灯片的方向，0不拖动，1水平，2垂直，3任意，默认值为1（请注意，$DISPLAYPIGES大于1或停车位置不为0时，$DRAGORIENTION应与$PLAYORIENTION相同）
$ArrowNavigatorOptions:{//[可选]用于指定和启用或不启用箭头导航器的选项
$Class:$jssorarrowsnavigator$，//[Required]类创建箭头导航器实例
$ChanceToShow:2，//[必需]0从不，1次鼠标悬停，2次始终
$AutoCenter:0，//[可选]父容器中的自动居中箭头，0个，1个水平，2个垂直，3个两者，默认值为0
$Steps:1//[可选]每个导航请求的步骤，默认值为1
}
};
var jssor_slider1=新的$JssorSlider$（containerId，选项）；
};

---

另外，请将a03.png移到您的

[root]/img

文件夹中。

页面的同一文件夹中是否有“jssor.slider.min.js”？我刚刚测试过，效果良好。请确保'jssor.slider.min.js'的引用路径正确。我将其与页面上的其他脚本一起放在javascript文件夹中。我将它移动到包含html文件的根文件夹中，但仍然无法显示幻灯片。我仍然在屏幕左侧看到红色X的堆栈。您的页面在哪个文件夹中？“jssor.slider.mini.js”在哪个文件夹中？最初，页面位于单独的文件夹中，而jssor.slider.mini.js不在我的网站上。我移动了jssor.slider.min.js，现在可以看到第一个图像，但它是左对齐的，没有导航箭头。我需要jssor.slider.mini.js和jssor.slider.min.js吗？我删除了该行并更正了路径，但它仍然挂在屏幕左侧，没有箭头。我需要在页面的css中添加什么吗？是的！这就解决了问题。再次感谢您一路上的帮助。你真是太棒了。

<script src="js/jssor.slider.min.js"></script>

<script>
    jssor_slider1_starter = function (containerId) {
        var options = {
            $DragOrientation: 3,                                //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
            $ArrowNavigatorOptions: {                       //[Optional] Options to specify and enable arrow navigator or not
                $Class: $JssorArrowNavigator$,              //[Requried] Class to create arrow navigator instance
                $ChanceToShow: 2,                               //[Required] 0 Never, 1 Mouse Over, 2 Always
                $AutoCenter: 0,                                 //[Optional] Auto center arrows in parent container, 0 No, 1 Horizontal, 2 Vertical, 3 Both, default value is 0
                $Steps: 1                                       //[Optional] Steps to go for each navigation request, default value is 1
            }
        };

        var jssor_slider1 = new $JssorSlider$(containerId, options);
    };
</script>