ResponsiveSlides中的图像计数器

时间:2013-11-03 12:54:33

标签: jquery responsive-slides

以任何方式在ResponsiveSlides图像中显示计数器

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

2 个答案:

答案 0 :(得分:2)

试试这个

$(document).ready(function(){

    $("#slider").responsiveSlides({
        speed: 500,
        auto: false,
        before: function(){}, // Function: Before callback
        after: function(){
            $(".current").html($(".slider").find("li#" + $("." + this.namespace + "1_on").attr("id")).index() + 1);
        } // Function: After callback
    });

    // Total amount of images and apply to div
    $(".total").html($(".slider li").index() + 1);

});

答案 1 :(得分:2)

// 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);
            } 
        });
    });