Welcome to the in5 Answer Exchange! This a place to get answers about in5 (InDesign to HTML5) and make requests.
0 votes
There is a way to set the Right and left keyboard keys to go to next/previous pages in the multi-page web format.

I'm considering changing from web to multi-page web for better performance, but the lack of keyboard navigation has been a factor in this decision, there is a possible workaround?
in how_to by (320 points)

1 Answer

0 votes

Try exporting (in5 > Export HTML5 with in5...) with the Page Format set to one of the Slider formats. Here's more info:

by (23.5k points)
Already was in Slider (fade in), but tried in the other 2 but no results
Would you be able to send us your InDesign file (or a sample file that recreates the issue)  and your html5_output to:

Sent the files

You can use Presentation Mode when the Output is set to Multi-page web to enable keyboard navigation. Here's how:

  • Go to in5 > Enhancements > Presentation Mode
  • In the Presentation Mode dialog, select
    • Enable Presentation Mode
    • Enable Keyboard Navigation
I am also seeing this happen on my multi-page web exports. the keyboard navigation doesn't seem present by default, but does work when you change it to presentation mode. is that the only way to get the navigation to work with keyboard arrows? the issue is when you are in full screen mode (i'll be posting another question about that separately) you can't see the mouse pointer unless hovering over a clickable item.

Myra's solution above is the best way to get the navigation to work with keyboard arrows. I saw your other question come through as well and requested that you send files so we can help you troubleshoot. 

For anyone else wondering about this and for the in5 team, I actually found a way to add keyboard navigation without turning on presentation mode (the keyboard navigation that presentation mode uses has next assigned to up, right, and spacebar, and that spacebar broke our notetaking module since adding a space between words would advance the page).

All i did was find the function that is added to the in5.config.js when presentation mode is turned on that reads:

$(document).on('keyup',function(e) {
if(e.keyCode == 39 || e.keyCode == 40 || e.keyCode == 32) nav.build();
else if(e.keyCode == 37 || e.keyCode == 38) nav.back();

So i snagged that code and modified it to remove the spacebar keycode (32) and removed the (if presmode.keynav) wrapper and appended it on export as a js file. works great! Final js below:

$(document).on('keyup',function(e) {
if(e.keyCode == 39 || e.keyCode == 40) nav.build();
else if(e.keyCode == 37 || e.keyCode == 38) nav.back();
I'm glad you got it working with your project. And thanks for sharing your code! :)
Definitely, thank you for posting your code for others to use! Appreciate it!