0

我们在我们的产品中实现了通用滑块功能。我们需要从 URL 中读取项目索引值并滚动滑块以显示活动项目。

以下代码逻辑用于显示活动缩略图，为此我需要将 DIV 动画到负左。

首先，我们从 URL 哈希值（即#slide=7）中获取总的缩略图项目和活动项目的索引。一套包含至少 5 个项目。需要将滑块宽度乘以 ActiveItemIndex 所在的页面集值。

Javascript 代码 -

showActiveThumbnailOnPageLoad : function() {
    var _this = this,
        totalThumbnails = $('.slidetabs a').length,
        activeItem = window.location.href.split('=')[1],
        scrollAmount;

    if(activeItem > 5 && activeItem <= 10) {
        scrollAmount = '-=' + 772
    } else if(activeItem > 10 && activeItem <= 15) {
        scrollAmount = '-=' + 772 * 2
    } else if(activeItem > 15 && activeItem <= 20) {
        scrollAmount = '-=' + 772 * 3
    }

    $('.slidetabs').stop().animate({
        left : scrollAmount
    });
}

截至目前，使用硬编码条件，最多支持 20 个项目。任何有助于使此代码支持 n 个项目的帮助。我的意思是说没有硬代码值的通用代码。

提前致谢。

4

3 回答 3

2

你可以试试 ：

scrollAmount = '-=' + 772 * ~~((activeItem - 1) / 5);
于 2013-04-24T10:27:46.000 回答
1

用这个：

scrollAmount = '-=' + 772 * Math.floor((((activeItem > 0) ? activeItem : 1)  - 1) / 5);
于 2013-04-24T10:31:39.653 回答
0

尝试这个：

scrollAmount = '-=' + 772 * ((activeItem  - 1) / 5);

编辑（基于此评论和此答案）

并四舍五入：

scrollAmount = '-=' + 772 * (((activeItem  - 1) / 5) >> 0);

或者：

scrollAmount = '-=' + 772 * (~~((activeItem - 1) / 5));
于 2013-04-24T10:26:01.470 回答