function dragHandle(dragDiv, barHeight, wrapperDiv, containerDiv, containerHeight, scrollDiv, hideContainer) {
    
    var animated = false;
    var offset = 40;
    
    if(containerHeight < $(wrapperDiv).height()) {
        
        $(dragDiv).height((barHeight / $(wrapperDiv).height()) * containerHeight);   
          
        var scrollMax = $("#mainscrollbar").height() - $(dragDiv).height();
        var scrollPosition = 0;
        
        $(dragDiv).draggable({
            axis : "y",
            "containment" : "parent",
            drag : function(e, ui) {
                scrollPosition = ui.position.top;
                var rate = (scrollPosition / scrollMax);
                var divMax = $(wrapperDiv).height() - $(containerDiv).height();
                $(wrapperDiv).css("top", ((divMax * rate) * -1) + "px");
            }
        });
        
        $(scrollDiv).eq(0).click(function() {
            //top
            $(dragDiv).css("top", "0");        
            $(wrapperDiv).css("top", "0");
        });
        
        $(scrollDiv).eq(1).click(function() {
            //up
            if(scrollPosition - offset > 0) {
                animated = true;
                $(dragDiv).animate({
                    top : (scrollPosition - offset) + "px"       
                }, 200, function() { animated = false });
                scrollPosition -= offset;
                var divMax = $(wrapperDiv).height() - $(containerDiv).height();
                var rate = (scrollPosition / scrollMax);
                $(wrapperDiv).animate({
                    top : ((divMax * rate) * -1) + "px"       
                }, 200, function() { animated = false });
            } else {
                animated = true;
                $(dragDiv).animate({
                    top : "0px"       
                }, 200, function() { animated = false });
                scrollPosition = 0;
                animated = true;
                $(wrapperDiv).animate({
                    top : "0px"       
                }, 200, function() { animated = false });
            }
        });
        
        $(scrollDiv).eq(2).click(function() {
            //down
            if(scrollPosition + offset > scrollMax) {
                animated = true;
                $(dragDiv).animate({
                    top : scrollMax + "px"        
                }, 200, function() { animated = false });
                scrollPosition = scrollMax;
                animated = true;
                var divMax = $(wrapperDiv).height() - $(containerDiv).height();
                $(wrapperDiv).animate({
                    top : (divMax * -1) + "px"       
                }, 200, function() { animated = false });
            } else {
                animated = true;
                $(dragDiv).animate({
                    top : (parseInt($(dragDiv).css("top")) + offset) < 0 ? "0px" : (parseInt($(dragDiv).css("top")) + offset) + "px"        
                }, 200, function() { animated = false });
                scrollPosition += offset;
                var divMax = $(wrapperDiv).height() - $(containerDiv).height();
                var rate = (scrollPosition / scrollMax);
                animated = true;
                $(wrapperDiv).animate({
                    top : ((divMax * rate) * -1) + "px"       
                }, 200, function() { animated = false });
            }
        });
        
        $(scrollDiv).eq(3).click(function() {
            //bottom
            scrollPosition = scrollMax;
            $(dragDiv).css("top", scrollMax + "px");
            var divMax = $(wrapperDiv).height() - $(containerDiv).height();
            var rate = (scrollPosition / scrollMax);        
            $(wrapperDiv).css("top", ((divMax * rate) * -1) + "px"); 
        }); 
        
        /** mousewheel **/
        $(containerDiv).bind("mousewheel", function(event, delta) {
            if(!animated) {
                if(delta > 0) {
                    $(scrollDiv).eq(1).trigger('click');
                } else {
                    $(scrollDiv).eq(2).trigger('click');
                }
            }
            return false;
        });
    
    } else {
        //$(dragDiv).hide();
        if(hideContainer == null) {
            hideContainer = ".cscroll";
        }
        $(hideContainer).hide();
    }    
            
}
