Slide Through Pages With Keyboard Arrows – Arrow-Web-Nav

Preview:

Description:

Arrow-Web-Nav is a small script which enables the user to navigate between your page sections with keyboard arrows.

How to use it:

Create top, right, bottom, left, and center page sections as these:

<div id="left-window">
  <h1>Left Window</h1>
  <p>This is the left most window</p>
</div>
<div id="center-window">
  <h1>Center Window</h1>
</div>
<div id="right-window">
  <h1>Right Window</h1>
  <p>This is the right most window</p>
</div>
<div id="top-window">
  <h1>Top Window</h1>
  <p>This is the top most window</p>
</div>
<div id="bottom-window">
  <h1>Bottom Window</h1>
  <p>This is the bottom most window</p>
</div>

Load the main script at the end of the document when needed.

<script src="script.js" async></script>

Changelog:

• Added click event handlers