Jssor非jQuery的滑块动态量在一个页面上的多个滑块(Jssor non-jquery sli

2019-10-23 00:06发布

我怎样才能把动态量多个滑块在一个页面上? 我可以在网页上使用2个滑块如下:

<script>
jssor_sliderb_starter1 = function (containerId) {
    ...
};
jssor_sliderb_starter2 = function (containerId) {
    ...
};

<div id="sliderb_container1">
...
<script>
    jssor_sliderb_starter1('sliderb_container1');
</script> </div> 

<div id="sliderb_container2">
...
<script>
    jssor_sliderb_starter2('sliderb_container2');
</script> </div>

但是,如果我不知道的东西滑块的金额是多少? 请帮忙..

Answer 1:

我已经添加了4个相同的滑块我的网页上有不同的图像和字幕,并用下面的代码,它工作正常。

<!-- Jssor Sliders -->
    <script>
    jssor_sliderb_starter = function (containerId) {
    ...
    };
    </script>


    <!-- Jssor Slider Begin -->
    <div id="sliderb_container1" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container1');
        </script>
    </div>

    <div id="sliderb_container2" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container2');
        </script>
    </div>

    <div id="sliderb_container3" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container3');
        </script>
    </div>

    <div id="sliderb_container4" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container4');
        </script>
    </div>
    <!-- Jssor Slider End -->

所以,现在,如果我增加更多的滑块我将不得不只使用不同的ID。 我感到困惑如何使用ID来调用函数,我想我必须写不同的功能,用于每个滑块。 但是,代码工作。 谢谢 :)



Answer 2:

<!-- Jssor Sliders -->
<script>
   jssor_sliderb_starter = function (containerId) {
   }
</script>

<div id="sliders">
    <!-- Jssor Slider Begin -->
    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>
    <!-- Jssor Slider End -->
</div>

<script>
    var slidersElement = document.getElementById("sliders");
    for (var tmpEl = slidersElement.firstChild; tmpEl; tmpEl =tmpEl.NextSibling) {
        if (tmpEl.nodeType == 1) {
            jssor_sliderb_starter(tmpEl);
        }
    }
</script>


文章来源: Jssor non-jquery slider dynamic amount multiple slider on one page
标签: jssor