Search code examples
jqueryresponsive-slides

Image counter in ResponsiveSlides


Any way to show counter in ResponsiveSlides image

<script>
  $(function() {
    $(".rslides").responsiveSlides();
  });
</script>

Solution

  • //html / php

    <ul id="rslides<?=$j?>" class="rslides slider" rel="<?=$j?>">
     image list here
    </ul>
    

    //js

    $(".rslides").each(function() {
    var id = $(this).attr('rel');
    
            $("#rslides"+id).responsiveSlides({
                auto: false,
                nav: true,
                speed: 500,
                maxwidth: 800,
                namespace: "unitSlides",
                after: function(){
                    console.log(this);
                    $("#slider_counter_"+id).html($(".slider").find("li#" + $("." + this.namespace + id +"_on").attr("id")).index() + 1);
                } 
            });
        });