ignore-reduced-motion
Keep the doodle moving when the user prefers reduced motion.
Without it, the doodle pauses while prefers-reduced-motion: reduce matches.
Syntax
- <css-doodle ignore-reduced-motion></css-doodle>
The attribute takes no value.
By default the doodle follows the preference as it changes: it pauses as pause() does,
nested doodles included, and auto:update skips its ticks.
A call to pause() or resume() takes over, and the preference is no longer followed.
Examples
<css-doodle ignore-reduced-motion>
@grid: 1 / 60vmin;
@place: center;
@shape: hexagon;
background: #000;
animation: spin 4s infinite linear;
@keyframes spin {
to { rotate: 1turn }
}
</css-doodle>