Ширина прокрутки не определена

Question

Я пытаюсь дать пользователю возможность прокручивать его мышью, нажимая левую кнопку мыши, а затем перетаскивая мышь.

и в соответствии с движениями сайта прокручивается.

Я хочу это только для x-ax

У меня есть Canvas больше, чем у окна

Я придумал этот код

var mouseDown = false;

    var previousPos = $(window).scrollLeft();
    document.addEventListener("mousedown", setDown);
    document.addEventListener("mouseup", setUp);
    function setDown() {
        mouseDown = true;
    }
    function setUp() {
        mouseDown = false;
    }

    document.addEventListener("mousemove", handleMove);
    function handleMove(event) {
        if(mouseDown) {
            console.log(`Previous: ${previousPos}`);
            console.log(`Current: ${event.movementX}`);
            console.log(`Calc:  ${previousPos+event.movementX}`);




                let oldPrevious = previousPos;


                previousPos = previousPos+event.movementX;
                window.scroll(previousPos, 0);

               console.log(window.scrollWidth);

                switch (checkScrollbar()) {
                    case "right":
                        previousPos = oldPrevious;
                        window.scroll(previousPos, 0);
                        break;

                    case "left":
                        previousPos = oldPrevious;
                        window.scroll(0, 0);
                        break;
                }
        }   
    }

    function checkScrollbar() {
        if (window.scrollWidth - $(window).scrollLeft() == $(window).width())
        {
            return "right";
        }
        else if($(window).scrollLeft() == 0)
        {
            return "left";
        }
        return "safe";
    }

Обратите внимание на это окно.scrollWidth не определено!

$ (окно) .scrollLeft () выдает точные пиксели каждый раз, но мне нужно максимальное значение

Answer 1

Проверка не нужна

Метод jquery scrollLeft уже устраняет эту проблему.

Таким образом, код просто:

var mouseDown = false;
var previousPos = $(window).scrollLeft();
document.addEventListener("mousedown", setDown);
document.addEventListener("mouseup", setUp);
function setDown() {
    mouseDown = true;
}
function setUp() {
    mouseDown = false;
}

document.addEventListener("mousemove", handleMove);
function handleMove(event) {
    if(mouseDown) {
        $(window).scrollLeft($(window).scrollLeft()+event.movementX);

    }   
}