I have a <picture>
tag with <source srcset="..." media="(prefers-color-scheme: dark)">
inside.
In my Javascript code, I need to switch the media attribute between the following 3 states:
- Only matching when the OS is in dark mode
- Always matching
- Never matching
I am currently achieving this by setting media="(prefers-color-scheme: dark)"
, media=""
and media="match_nothing"
for states 1, 2 and 3 respectively. I tried it, and it seemed to achieve the exact result I was looking for.
Other than by deleting the entire source element, is there a documented way of achieving this result, instead of using the improvised "match_nothing"
attribute value?