0

I'm trying to do some basic horizontal scrolljacking in JavaScript, but I'm having no luck. The JavaScript I have looks something like this

window.onwheel = onWheel;

function onWheel(e) {

    if (e.deltaY != 0) {
        e.preventDefault();
        e.stopPropagation();
        var scrollX = scrollJack(e.deltaX, e.deltaY);
        window.scrollBy(scrollX, 0);
    }

    // var inFirstPage = e.target.id == 'canvas';
}

function scrollJack(dx, dy) {
    // because we're scrolling horizontally, this should put all of the dy into dx

    // return the future value of dx

    var magnitude = Math.pow(dx * dx + dy * dy, 0.5);

    // a positive dy implies scrolling down

    // if dy is positive, go right

    var direction = ((dy + dx) > 0) ? 1 : -1;

    return magnitude * direction;
}

I can't tell why it's not providing the intended result. I've made a jsfiddle here if that helps: https://jsfiddle.net/6q0qanv5/

I'm also not trying to use any jQuery, I'm just trying to understand what about my current 'solution' is missing/wrong

mjkaufer
  • 4,047
  • 5
  • 27
  • 55

0 Answers0