Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Set your website to respect prefers-reduced-motion and prevent animation from being displayed.

For example in connection with anchor/jump linksYou can use the prefers-reduced-motion media query to apply specific styles that reduce or eliminate animations and transitions

Add the following CSS media query to the site.

Code Block
@media (prefers-reduced-motion: reduce) {

  /* CSS to disable motion goes here */

}

When For example when the user selects an anchor/jump link the page will smooth-scroll to the content selected, instead of a hard and abrupt jump. 

...