javascript - iOS Progressive Web App 暗模式启动图像？

Question

我正在尝试为我的 iOS PWA 的 apple-touch-startup-image（启动画面）创建一个深色模式选项，如果开启深色模式，那么它将替换 apple-touch-startup-images 的所有链接为我的用户设置暗模式。

我已经考虑过这一点，因为暗模式适用于 css：

@media(prefers-color-scheme: dark){ ... }

那么它可以很容易地替换它们。

我创建了这个 javascript，但它似乎没有用：

var darksplash = window.matchMedia( "(prefers-color-scheme: dark)" );
if (darksplash.matches) {document.querySelector('link[rel="apple-touch-startup-image"]').setAttribute("href", "assets/images/splashscreens/dark.png");}

有任何想法吗？我在想这可能是 javascript 代码中的一个错误，我不是最擅长 JavaScript。

标签： javascripthtmlioscssprogressive-web-apps

Answer 1

您只需要在每个图像下添加另一个 apple-touch-startup-image，并在 media="" 开头添加 "(prefers-color-scheme: dark) 和 "

发现于： https ://github.com/onderceylan/pwa-asset-generator/issues/51