Question

所以我有一个内容滑块

每个项目都有一个类，其中包含滑块

中的项目的偏移量

像

<div id="slider">
     <div class="item item-num-1"></div>
     <div class="item item-num-2"></div>
     <div class="item item-num-3"></div>
</div>

并且它是一个圆形滑块，在最后一个项目之后再次显示第一个项目

所以我在顶部的滑块上添加了自定义指示器，但与大多数滑块不同，每个指示器都适用于滑块中的每4个项目

for example

when i have 1-4 items theres is 1 indecitor 
when there are 1-8 items i have 2 indicators 
when there are 1-12 items i have 3 indicators

所以我想将活动类添加到用户开始滑动的右侧指示器

$(document).on('click' , '.prev , .next' , function(){


    var p      = $(this).parents('#slider');
    var it     = p.find('.item:first');
    var offset = Number(it.attr('class').split(' ').pop().replace('item-num-', '' ));

    var indicator_number ;

    if( offset <= 4 )
    indicator_number = 1 ;
    else
    indicator_number = ? ;


    $('.inidicator').eq( indicator_number ).addClass( "active" );


})

我希望这部分indicator_number = ? ;我希望公式在当前项目的偏移量大于4时找到正确的指标

Answer 1

简单的算术可以满足您的需求：

indicator_number = Math.floor((offset - 1) / 4) + 1);

offset - 1：获取当前幻灯片的零基础索引 / 4：划分 + 1：将结果更改为基于非零的索引 Math.floor：转换为整数

创建自定义指标 - 每个指标位于滑块中

1 个答案: