Train timetable that uses a grid with multiple
focusable rowgroups.
Each rowgroup represents a range of times, namely, morning rush
hour, midday, and evening rush hour. The background provides a visual
cue for each rowgroup, and aria-labelledby provides a name. Each
rowgroup is interactive allowing users to hide times they are not
interested in.
rowgroup00:0000:0000:0000:00Train timetable that uses a <table> with multiple
focusable <tbody>s.
Each <tbody> represents a range of times, namely, morning
rush hour, midday, and evening rush hour. The background provides a visual
cure for each, and aria-labelledby provides a name. Each
<tbody> is ineractive allowing users to hide times they are
not interested in.
| Station 1 | Station 2 | Station 3 | Station 4 | |
|---|---|---|---|---|
| Morning Rush Hour (click to hide) | 6:30 | 6:45 | 7:05 | 7:10 |
| 7:00 | 7:10 | 7:30 | 7:35 | |
| Midday (click to hide) | 13:00 | 13:15 | 13:35 | 13:40 |
| 13:30 | 13:45 | 14:05 | 14:10 | |
| Evening Rush Hour (click to hide) | 16:25 | 16:40 | 17:00 | 17:05 |
| 16:40 | 16:55 | 17:15 | 17:20 | |
Unfocusable TBODY | 00:00 | 00:00 | 00:00 | 00:00 |
| 00:00 | 00:00 | 00:00 | 00:00 |