Flexible Article Reading Time Indicator - Active Reading Time

Active Reading Time is a simple, flexing jQuery reading time plugin which helps create a reading line and reading indicator displaying the estimated reading time for the rest content when you scroll down the webpage. The major difference to other reading time plugins is that the plugin calculates/displays the remaining reading time based on a configurable reading speed (200 words per minutes by default) rather than the page scroll percentage.

How to use it:

1. Add references to jQuery library and the Active Reading Time's stylesheet & JavaScript files:

<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="active-reading-time.css">
<script src="active-reading-time.jquery.js"></script>

2. Active the reading time indicator by calling the function activeReadingTime on the target article container.

$("article").activeReadingTime();

3. All possible plugin options to customize the reading time indicator.

$("article").activeReadingTime({

  // Distance (in pixels) from the top of the element
  topMargin: 40,

  // Distance (in pixels) from the bottom of the element
  bottomMargin: 40,

  // Expected average words per minute for your audience
  defaultWordsPerMinute: 200,

  // Only shows minutes
  minutesOnly: false
  
});

Change log:

2017-02-16

• converted indents to spaces

---

This awesome jQuery plugin is developed by ecaroth. For more Advanced Usages, please check the demo page or visit the official website.