分享一则JavaScript滚动条插件源码

2020-05-23 06:21:34易采站长站整理

            currScroll.context.style.position = ‘relative’;
            //先呈现在页面上才可以读取位置数据
            dom.appendChild(currScroll.scrollUl);
            this.change();
            tool.addScrollEvent(currScroll.context, function (e) {
                //绑定鼠标滚轮事件,3px滚动单位
                if (e.wheel > 0) {//滚轮向上滚动
                    var currTop = currScroll.endTop -= 3;
                    currScroll.scrollEvent.call(currScroll, currTop);
                } else {//滚轮向下滚动
                    var currTop = currScroll.endTop += 3;
                    currScroll.scrollEvent.call(currScroll, currTop);
                }
            });
            //需要处理禁止文字在拖动的时候被选中  TODO
            //鼠标点下事件,需要判断是否是左键点击,目前右键也会实现滚动  TODO
            tool.addEvent(currScroll.scrollUl, ‘mousedown’, function (e) {
                mouseDown.call(currScroll, e);
            });
            //追加事件,为了更好的用户体验在body上实现监听
            tool.addEvent(document.body, ‘mousemove’, function (e) {
                if (currScroll.isDrag) {
                    //获取当前鼠标位置
                    var position = tool.getMousePos(e);