• Register
Welcome to the in5 Answer Exchange! This a place to get answers about in5 (InDesign to HTML5) and make requests.

Progress Bar for page count?

0 votes
Is there a way to show a progress bar like an e-reader would? Looking to show how far a user has gone in a book we are exporting using multi-page export. Perhaps you have seen a plugin that works with in5 to accomplish this?
asked Jun 13 in how_to by jcfalteredimage (380 points)
Created a full tutorial (link in the answer below).

1 Answer

0 votes
answered Jun 20 by justin (113,940 points)
edited Jun 26 by justin
Thank you so much for the support. I knew there had to be a way!
Happy to help. :-)
When we are using the multi-page export, the progress bar is flashing on the next page load. It seems to start back at zero each time. Is there a way to make it smoother and advance from the previous pages progress? We attempted to use a local storage solution but we are not having luck.
Remove the CSS animation from the extra code.

From this:
$progbar.css({'width':0, 'height':bar_height,
    'position':'fixed', 'bottom':0, 'background':bar_color,
    '-webkit-transition':'.5s width',
    'transition':'.5s width'});

To this:
$progbar.css({'width':0, 'height':bar_height,
    'position':'fixed', 'bottom':0, 'background':bar_color, });

You could also use local storage to set the start width (instead of 0, and leave the animation in).