5/20/2023 0 Comments Rotating image carouselHovering the mouse over any carousel content pauses automatic rotation.Īutomatic rotation resumes when the mouse moves away from the carousel unless another condition, such as keyboard focus, that prevents rotation has been triggered. This example includes the following features for giving users control over slide rotation: Similarly, since screen reader users cannot perceive automatic rotation, it can make reading the page confusing and disorienting.įor example, when slides are automatically rotating, a screen reader user may read an element on slide one, execute a screen reader command to read the next element, and, instead of hearing the next element on slide one, hear an element from slide 2 without any knowledge that the element just announced is from an entirely new context. People with low vision or a cognitive disability that effects visual processing or reading benefit from being able to control slide rotation so they have sufficient time to explore slide content. Users can stop and start slide rotation, which is an essential aspect of accessibility of the carousel for a variety of people with disabilities. Carousel controls and captions displayed above and below the image: This option is preferable because controls and captions are easier to perceive.Īccessibility Features Controlling Automatic Slide Rotation.Carousel controls and captions displayed on image: This option is less accessible than the other option because the controls are harder to perceive and captions are more difficult to read with rotating images behind them.The accessibility features section that follows the example describes these features in detail. The following example implementation of theĭemonstrates features of the pattern that are essential to accessibility for carousels that automatically start rotating when the page loads.įor instance, rotation stops when users move focus to any control or link in the carousel or hover the mouse over carousel content. Browser and Assistive Technology Support. Auto-Rotating Image Carousel Example | WAI-ARIA Authoring Practices 1.1
0 Comments
Leave a Reply. |