文字过长隐藏后用鼠标移动及滚动效果代码

admin

1、用鼠标滚轴代替移动代码，这里的.Subject有overflow:hidden
let box = document.querySelector(".search .Subject");
box.addEventListener("mousewheel", function (event) {
    // -event.wheelDelta / 2 代表幅度(速度),2可以更改
    let v = -event.wheelDelta / 2;
    box.scrollLeft += v;
    event.preventDefault();
}, false)

2、鼠标移动代码let init_x;
box.onmousedown = function (e) {
        init_x = e.pageX;
};
box.onmousemove = function (e) {
        let move_x = e.pageX - init_x;
        box.scrollLeft += move_x;
        e.preventDefault();
}

3、通用函数
var move_x = function (dom) {
        let init_x;
        let box = document.querySelector(dom);
        box.addEventListener("mousewheel", function (e) {
                let v = -e.wheelDelta / 2;
                box.scrollLeft += v;
                e.preventDefault();
        }, false);
        box.onmousedown = function (e) {
                init_x = e.pageX;
        };
        box.onmousemove = function (e) {
                let move_x = e.pageX - init_x;
                box.scrollLeft += move_x;
                e.preventDefault();
        }
}调用方法：move_x(".Subject");
参数遵循document.querySelector(dom)选择器。