sensitiveslides.js-获取当前幻灯片 [英] responsiveslides.js - get current slide

问题描述

需要从当前处于活动状态的幻灯片中获取数据编号"值.我想使用此值在页面的另一个div中显示/隐藏其他信息.或者，如果除了添加特定的数据编号"值之外，还有其他方法让我知道-我在文档中看不到任何返回幻灯片编号的

Need to get the 'data-number' value from the current slide that is active in the slider. I want to use this value to show/hide additional info in another div of the page. Or if there is some other way other than adding a specific 'data-number' values let me know - I saw nothing in the doc which returning the slide number.

我知道我可以使用之后"回调执行我想要的操作，但不确定如何首先获得该值.

I know I can use the 'after' callback to then do what I want, but not sure how I can go about getting this value in the first place.

<div class="row">
    <div class="col-md-12">
        <ul class="rslides" id="slider1">
            <li data-number="1">
                <img src="/user-data/2/screenshots/demo21.jpg" alt="">
            </li>
            <li data-number="2">
                <img src="/user-data/2/screenshots/demo22.jpg" alt="">
            </li>
            <li data-number="3">
                <img src="/user-data/2/screenshots/demo23.jpg" alt="">
            </li>
            <li data-number="4">
                <img src="/user-data/2/screenshots/demo24.jpg" alt="">
            </li>
            <li data-number="5">
                <img src="/user-data/2/screenshots/demo25.jpg" alt="">
            </li>
        </ul>               
    </div>
</div>

$("#slider1").responsiveSlides({
    auto: false,             // Boolean: Animate automatically, true or false
    speed: 500,            // Integer: Speed of the transition, in milliseconds
    timeout: 4000,          // Integer: Time between slide transitions, in milliseconds
    pager: true,           // Boolean: Show pager, true or false
    nav: true,             // Boolean: Show navigation, true or false
    random: false,          // Boolean: Randomize the order of the slides, true or false
    pause: false,           // Boolean: Pause on hover, true or false
    pauseControls: true,    // Boolean: Pause when hovering controls, true or false
    prevText: "Previous",   // String: Text for the "previous" button
    nextText: "Next",       // String: Text for the "next" button
    maxwidth: "",           // Integer: Max-width of the slideshow, in pixels
    navContainer: "",       // Selector: Where controls should be appended to, default is after the 'ul'
    manualControls: "",     // Selector: Declare custom pager navigation
    namespace: "centered-btns",   // String: Change the default namespace used
    before: function(){},   // Function: Before callback
    after: function(){}     // Function: After callback
}); 

推荐答案

无需在列表中添加数据属性.您可以像这样获取当前幻灯片的索引:

No need to add a data attribute to the list. You can take the index of the current slide like this:

$("#slider1").responsiveSlides({
    after: function(i){
        // i is equal to the index of the current active slide
    // Your code here
    }
);

这篇关于sensitiveslides.js-获取当前幻灯片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！