JS滑块计数器不工作..需要找到一种方法使其正常工作

JS slider counter not working...need to find a way to make it work as it should

本文关键字：工作 方法 一种 常工作 JS 计数器      更新时间：2023-09-26

我需要一些帮助来使这个滑块计数器工作，目前正在使用sudoslider，但似乎无法使其按我的意愿工作，有人能帮助我从滑块文档中尝试，但无法正常工作吗。。。随着幻灯片的继续，需要修改它的编号，比如1/2..2/2有些人是这样的。。。？

          html code:
          <div id="slider">
                <ul>
      <li><img src="images/1.png" alt="img"></li>
      <li><img src="images/2.png" alt="img"></li>
      <li><img src="images/3.png" alt="img"></li>
                </ul>
      </div>
    <div class="siteBtn">
    <a href="#">
    Visit Us
    </a>
    </div>
    <div class="sliderBtn">
        <a href="#" class="customLink" rel="prev"><img src="images/prevBtn.png" alt="img"></a>
    <a href="#" class="customLink" rel="next"><img src="images/nextBtn.png" alt="img"></a>
    </div>
    <div class="descrip-text"><p id="anistate"  ></p>
        <span>Slide:</span>
        <span id="slidenumber"></span> 
        <span>/5</span> 
    </div> 

    JS code:
    $(document).ready(function(){   
    var sudoSlider = $("#slider").sudoSlider({
       customLink:'a.customLink',
       prevNext:false,
       controlsFade:false
       // customlink:true
    });
});

      $(document).ready(function(){
            var sudoSlider = $("#slider").sudoSlider({
               numeric: true,
              beforeAnimation: function(slide){
                 $('div.descrip-text #anistate').text(slide).show(600);
          },
          afterAnimation: function(slide){
             $('div.descrip-text #anistate').hide(400);
             $('div.descrip-text #slidenumber').text(slide);
             var text = $(this).children().attr('src');
             $('div.descrip-text #slidehtml').text(text);
          },
          initCallback: function() {
             var slide = this.getValue("currentSlide");
             $('div.descrip-text #slidenumber').text(slide);
             var text = this.getSlide(slide).children().attr('src');
             $('div.descrip-text #slidehtml').text(text);
          }
       });
    });

我不确定这是否是你想要实现的，但请检查这个小提琴：http://jsfiddle.net/3NVhR/1/

$(document).ready(function () {
    var sudoSlider = $("#slider").sudoSlider({
        customLink: 'a.customLink',
        prevNext: false,
        controlsFade: false,
        auto: true,
        afterAnimation: function (slide) {
            var slide = sudoSlider.getValue("currentSlide");
            $('div.descrip-text #slidenumber').text(slide);
        },
        initCallback: function() {
            var slides = sudoSlider.getValue('totalSlides');
            $('div.descrip-text #slidenumber').next('span').text("/ " + slides);
        }
    });
});
相关文章：