<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>ArrowUp/Down -> PageUp/Down testi</title>
        <script>
            window.onload = () => {
                document.addEventListener('keydown', (e) => {
                    console.log("'"+e.key+"' painettu");
                    if(e.key == 'ArrowDown') {
                        console.log('ArrowDown painettu, laukaistaan keydown-eventti PageDownilla');
                        document.dispatchEvent(new KeyboardEvent('keydown',{'key': 'PageDown'}));
                    }
                    if(e.key == 'Enter') {
                        console.log('Enter painettu, laukaistaan keydown-eventti PageDownilla');
                        document.dispatchEvent(new KeyboardEvent('keydown',{'key': 'PageDown'}));
                    }
                    if(e.key == 'ArrowUp') {
                        console.log('ArrowUp painettu, laukaistaan keydown-eventti PageUpilla');
                        document.dispatchEvent(new KeyboardEvent('keydown',{'key': 'PageUp'}));
                    }
                    if(e.key == 'PageDown') {
                        alert('PageDown painettu, tavalla tai toisella');
                    }
                    if(e.key == 'PageUp') {
                        alert('PageUp painettu, tavalla tai toisella');
                    }
                });
            };
        </script>
    </head>
    <body>
        <h1>ArrowUp/Down -> PageUp/Down testi</h1>
        <p>Enter lähettää PageDown-eventin</p>
        <p>ArrowDown lähettää PageDown-eventin</p>
        <p>ArrowUp lähettää PageUp-eventin</p>
    </body>
</html>