/o//commerce-media/accounts/-1/images/29570037?download=true
Indicate the reading progress with a progress bar on top of an article. Usage:
- Add the reading-progress fragment to a page. In the page editor, you'll see the (empty) progress bar and a drop zone
- The progress bar initially contains a notice to the page author: Due to the way HTML works, it can't work within any element that uses "overflow:hidden" - e.g. within a Grid. This message is only shown on the page editor, never to the actual user.
- You can change the author's notice, e.g. map it to "reading time" of a blog article - as soon as it's changed, it will show on an actual page.
- Any content that you add to the drop zone is being monitored by the progress indicator, which will grow until the scroll position includes the bottom of the content .
- The progress indicator will be sticky instead of scrolling out on the top of the page, but at the end of the article, it will scroll out.
- You can configure (1) if it shows initially. Use this depending on the length of your typical content and screen size: Javascript will make it appear/disappear when it's (un)necessary, but it'll flicker in either direction - choose your poison .
- You can configure (2) the color of the indicator - e.g. pick from your stylebook
HTML Example
A paragraph is a self-contained unit of a discourse in writing dealing with a particular point or idea. Paragraphs are usually an expected part of formal writing, used to organize longer prose.