Jquery自定义滚动条问题

Question

我发现这个代码使用Jquery进行滚动，但我认为这是为了滚动整个主体。我想滚动页面的一部分。容器ID是boxL，我可以看到div并拖动它们但容器没有滚动。任何人都可以帮我弄清楚我需要做什么吗？

修改 我做了一些更改，现在它正在滚动，但是栏没有跟随鼠标，并且轨道没有调整到新的底部位置;我还在所有代码的末尾移动了js代码，以确保所有内容都已加载。

滚动条仅在我到达容器底部时移动。

Code found here

$(document).ready(function(){ 
    $('#boxL').append('<div id="scrollbar-track"><div id="scrollbar"></div></div>');
    function scrollBar(){
        var viewportHeight = $('#boxL').height();
        var docuHeight = $('#boxL').height();
        var trackHeight = $('#scrollbar-track').height();
        var scrollbarHeight = (viewportHeight/docuHeight)*trackHeight;
        $('#scrollbar').height(scrollbarHeight);
        $('#scrollbar').draggable({
            axis: 'y',
            containment: 'parent',
            drag: function() {
                var scrollbarTop = parseInt($(this).css('top'));
                var scrollTopNew = (scrollbarTop/(trackHeight))*docuHeight;
                $('#boxL').scrollTop(scrollTopNew);
            }
        });
        $("body").bind("mousewheel", function (event, delta) {
            var scrollTop = $('#boxL').scrollTop();
            var scrollTopNew = scrollTop - (delta * 40);
            $(window).scrollTop(scrollTopNew);
            var scrollbarTop = ($('#boxL').scrollTop()/docuHeight)*trackHeight;
            $('#scrollbar').css({
                top: scrollbarTop
            });
        });

    }
    scrollBar();
    $('#boxL').resize(function(){
        scrollBar();
    });
});