Developer Checklist — JavaScript Appendices

Correct code

JS_G_A1: Visually-dynamic information (such as a progress meter) should have a text equivalent

This example shows how visually-dynamic information can be supplemented with dynamic text that provides the same information. In this case, a visual progress meter also shows a percentage figure.

Live Demo

The demo below shows a simple progress meter, which animates from zero to 100% over five seconds. In practise the increments would be linked to another process, such as loading or processing data, but here it's just an animated demo:

Progress: 0%

JavaScript Code

The JavaScript code for this example can be found in: JS_G_A1.js

The CSS for this example can be found in: JS_G_A1.css