Перетаскивание экрана для прокрутки - PullRequest
0 голосов
/ 09 января 2020

Я пытаюсь перетащить экран мышкой по горизонтали / вертикали. Я могу добиться горизонтального перетаскивания с помощью этого видео: https://www.youtube.com/watch?v=C9EWifQ5xqA.

Я пробовал аналогичные логи c для вертикального направления, но почему-то это не работает. Может кто-нибудь, пожалуйста, дать некоторое представление о том, что может быть не так? Или можете поделиться каким-либо другим способом перетаскивания экрана мышью по вертикали?
Это код logi c Я использую:

const container = document.querySelector('#inventory');

    let startY;
    let startX;
    let scrollLeft;
    let scrollTop;
    let isDown;

    container.addEventListener('mousedown',e => mouseIsDown(e));  
    container.addEventListener('mouseup',e => mouseUp(e))
    container.addEventListener('mouseleave',e=>mouseLeave(e));
    container.addEventListener('mousemove',e=>mouseMove(e));

    function mouseIsDown(e){
    isDown = true;
    startY = e.pageY - container.offsetTop;
    startX = e.pageX - container.offsetLeft;
    scrollLeft = container.scrollLeft;
    scrollTop = container.scrollTop; 
    }
    function mouseUp(e){
    isDown = false;
    }
    function mouseLeave(e){
    isDown = false;
    }
    function mouseMove(e){
    if(isDown){
        e.preventDefault();
        //Move vertcally
        const y = e.pageY - container.offsetTop;
        const walkY = y - startY;
        container.scrollTop = scrollTop - walkY;

        //Move Horizontally
        const x = e.pageX - container.offsetLeft;
        const walkX = x - startX;
        container.scrollLeft = scrollLeft - walkX;

    }
    }

1 Ответ

0 голосов
/ 09 января 2020

Я использовал panzoom в прошлом и был приятно удивлен этим. Я бы рекомендовал использовать такую ​​библиотеку, а не кодировать ее вручную. Он имеет ослабление, которое улучшает пользовательский опыт.

...