0

私はサムネイルの自動スクロールスクリプトに取り組んできました。JavaScript を複製せずに、複数のバージョンのスクローラーを使用する方法を誰か提案できますか? コードを汎用的にできれば素晴らしいのですが、サムネール スクローラーが機能する DIVS の ID を、おそらく変数で指定してください。助けていただければ幸いです。:)

これはJSFiddleにあります。

JavaScript は次のようになります。

$(function() {
    buildThumbs();

    function buildThumbs() {
        $('div.album').each(function() {
            var width = 0;

            var wrapper = $(this).find('.st_thumbs_wrapper');
            wrapper.find('.st_thumbs a').each( function() {
                width += $(this).outerWidth(true);
            });

            var thumbs = $(this).find('.st_thumbs');
            thumbs.css('width', width + 'px');

            makeScrollable(thumbs, wrapper);
        });
    }

    function makeScrollable(thumbs, wrapper) {
        var width = wrapper.innerWidth();

        wrapper.scrollLeft(0);

        var leftBuffer = 200;
        var rightBuffer = 200;

        //When user move mouse over menu
        wrapper.unbind('mousemove').bind('mousemove', function(e) {
            var xPos = e.pageX - wrapper.offset().left - leftBuffer;
            var xMax = wrapper.innerWidth() - rightBuffer;
            if(xPos > 0 && xPos < xMax) {
                var perc = xPos / (xMax - leftBuffer);
                var scrollAmt = thumbs.outerWidth(true) - wrapper.innerWidth();
                wrapper.scrollLeft(perc * scrollAmt);
            }
        });
    }
});
4

1 に答える 1