-2

I am working on a WebGL application and I use the spacebar for movement of the camera. The problem is, when I press the spacebar the website also scrolls down. Is there a way to disable this feature?

None of the answers so far works reliably. They work for about a second, then the site scrolls down for a tiny amount of time and then the cycle repeats.

This is my code for the keypresses: 

window.addEventListener("keydown", (e) =>  {
    if(e.repeat) { return; }

    if(e.which == 27 || e.which == 9) {
        document.exitPointerLock();
        checkMouse = false;
    }

    if(checkMouse) {
        if(e.which == 87) { forwardPressed = true; }
        if(e.which == 83) { backwardPressed = true; }
        if(e.which == 65) { leftPressed = true; }
        if(e.which == 68) { rightPressed = true; }
        if(e.which == 32) { upPressed = true; event.stopPropagation(); event.preventDefault(); }
        if(e.which == 16) { downPressed = true; }
    }
});

As you can see, for the space key there already is one solution implemented but both types of answers I have gotten so far don't work.

user11914177
  • 885
  • 11
  • 33
  • 4
    Duplicate of [Pressing spacebar scrolls page down?](https://stackoverflow.com/questions/2343573/pressing-spacebar-scrolls-page-down) – Guy Incognito Jun 05 '20 at 07:44
  • @GuyIncognito That doesn't work reliably – user11914177 Jun 05 '20 at 07:49
  • 1
    You need to mention in the question what solutions you've tried and what exact problems you've hade with them. Otherwise you can't avoid getting generic solutions to the stated problem. – Guy Incognito Jun 05 '20 at 07:52
  • @GuyIncognito I'm pretty sure there is a generic solution to this problem, but the answers so far just haven't worked reliably. – user11914177 Jun 05 '20 at 07:54
  • 1
    The generic, reliable solution is in the duplicate. If it doesn't work for you, you have some other code that's interfering with it. – Guy Incognito Jun 05 '20 at 07:56
  • @GuyIncognito so I added some of my code... – user11914177 Jun 05 '20 at 08:09
  • 1
    `if(e.repeat) { return; }` <-- this is obviously preventing the code to do `event.preventDefault()` later if you hold the spacebar down. – Guy Incognito Jun 05 '20 at 08:15
  • 1
    ...and this is a prime example why you should always show your code when it doesn't work, instead of insisting that everyone else is wrong. – Guy Incognito Jun 05 '20 at 08:24
  • @GuyIncognito And that also is a prime example why you shouldn't just close a question because its about a topic that already has been answered – user11914177 Jun 05 '20 at 08:35

2 Answers2

1

You can do it something like this

$(document).keypress(function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);

    if(keycode == '32') {
        event.preventDefault();
    }
});
Nabil Farhan
  • 59
  • 2
0

Add this to your javascript:

let checkMouse = true
window.addEventListener("keydown", (e) =>  {
if(e.repeat) { 

    return; 
}

if(e.which == 27 || e.which == 9) {
    document.exitPointerLock();
    checkMouse = false;
}

if(checkMouse) {
    if(e.which == 87) { forwardPressed = true; }
    if(e.which == 83) { backwardPressed = true; }
    if(e.which == 65) { leftPressed = true; }
    if(e.which == 68) { rightPressed = true; }
    if(e.which == 32) { upPressed = true; event.stopPropagation(); event.preventDefault(); }
    if(e.which == 16) { downPressed = true; }
}
if (e.which == 32) {
    return !(e.keyCode == 32);
}
});

checkMouse wasn't initialised before. It's working fine here.

Priyank-py
  • 349
  • 3
  • 14