自定义滚动条插件

$.fn.mi_scroll=function(options){
    
    var par;
    var chil;
    var iS;
    
    
    var oScrollBar=$('<div></div>').attr({'class':'scrollBar'});
    var oBarL = $('<a></a>').attr({'class':'barL'});
    var oBarM = $('<div></div>').attr({'class':'barM'});
    var oBarR = $('<a></a>').attr({'class':'barR'});
    var oBar = $('<a></a>').attr({'class':'bar'});
    
    var scroller = $(this);
    
    scroller.append(oScrollBar.append(oBarL,oBarM.append(oBar),oBarR));
    
    var maxL = oBarM.outerHeight(false) - oBar.outerHeight(false);
    
    var timer = null;
    var timer2 = null;
    
    var disX = 0;
    var bDrag = false;
    
    return this.each(function() {
        
        var opts = $.extend({},$.fn.mi_scroll.defaults,options);
        
        var oList=scroller.find(opts.par);
        var oUl=scroller.find(opts.chil);
        var iStep=opts.iS;
        
        oBar.mousedown(function (event) {
            var e = event || window.event;
            bDrag = true;
            disX = e.clientY - oBar.position().top;
            return false;
        });
        $(document).mousemove(function (event) {
            if (!bDrag) return false;
            var e = event || window.event;
            var iL = e.clientY - disX;
            iL <= 0 && (iL = 0);
            iL >= maxL && (iL = maxL);
            oBar.css({ 'top': iL });
            oUl.css({ 'top': -parseInt((oUl.outerHeight(true) - oList.outerHeight(false)) * iL / maxL) });
            return false;
        }).mouseup(function () {

            bDrag = false;
            return false;
        });
        oBar.click(function () {
            return false;
        });

        oBarR.mousedown(function () {
            timer = setTimeout(function () {
                timer2 = setInterval(function () {
                    toStep = (iStep < maxL - oBar.position().top) ? iStep : maxL - oBar.position().top;
                    moveTogethor(toStep);
                }, 100);
            }, 300);
            return false;
        }).mouseup(function () {
            clearTimeout(timer);
            clearInterval(timer2);
            return false;
        });
        oBarR.click(function () {
            toStep = (iStep < maxL - oBar.position().top) ? iStep : maxL - oBar.position().top;
            console.log(toStep);
            moveTogethor(toStep);
        });


        oBarL.mousedown(function () {
            timer = setTimeout(function () {
                timer2 = setInterval(function () {
                    toStep = (oBar.position().top < iStep) ? oBar.position().top : iStep;
                    moveTogethor(-toStep);
                }, 100);
            }, 300);
            return false;
        }).mouseup(function () {
            clearTimeout(timer);
            clearInterval(timer2);
            return false;
        });
        oBarL.click(function () {
            toStep = (oBar.position().top < iStep) ? oBar.position().top : iStep;
            moveTogethor(-toStep);
        });

        function addHandler(element, type, handler) {
            return element.addEventListener ? element.addEventListener(type, handler, false) : element.attachEvent("on" + type, handler);
        }
        
       

//        oList.mouseenter(function(event){
//            var e = event || window.event;        
//            function mouseWheel(e)
//            {
//                var delta = e.wheelDelta ? e.wheelDelta : -e.detail * iStep
//                var iTarget = delta > 0 ? -iStep : iStep;
//                if(iTarget>0){
//                    toStep=(iStep<=maxL-oBar.position().top)?iStep:maxL-oBar.position().top;
//                }
//                else{
//                    iTarget=(oBar.position().top<=iStep)?oBar.position().top:iStep;
//                    toStep=-iTarget;
//                }
//                moveTogethor(toStep);
//            }
//            addHandler(this, "mousewheel", mouseWheel);
//            addHandler(this, "DOMMouseScroll", mouseWheel);
//
//        });
                    

        oBarM.click(function (event) {
            var e = event || window.event;
            toStep = e.clientY - oBar.position().top - oBarM.offset().top - oBar.outerHeight(true) / 2;
            if (toStep + oBar.position().top < 0) toStep = -oBar.position().top
            else if (toStep > maxL - oBar.position().top) toStep = maxL - oBar.position().top;
            moveTogethor(toStep);
        });
        function moveTogethor(toStep) {
            if (parseInt(!oBar.is(':animated') && oBar.position().top) <= maxL) {
                oBar.stop(true,true).animate({ 'top': oBar.position().top + toStep }, 100);
                oUl.stop(true,true).animate({ 'top': parseInt(oUl.css('top')) - parseInt(toStep * (oUl.outerHeight(true) - oList.outerHeight(false)) / maxL) }, 100);
            }
        }
    });
    return this;
}
$.fn.mi_scroll.defaults={
    par : '.list',//父节点
    chil : 'ul',//子节点
    iS : 30//步长
};

代码重复比较多，暂时懒的优化，先放在这里了