0

製品には一般的なスライダー機能が実装されています。URL からアイテム インデックス値を読み取り、スライダーをスクロールしてアクティブなアイテムを表示する必要があります。

次のコード ロジックは、アクティブなサムネイルを表示するために使用されます。そのためには、DIV を負の左にアニメーション化する必要があります。

まず、サムネイル アイテムの合計を取得し、次に URL ハッシュ値 (つまり #slide=7) からアクティブなアイテムのインデックスを取得します。1 セットには最低 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 に答える