通过Darkmode.js实现黑暗模式

慢慢 2022-6-4 55 6/4

Darkmode.Js – 一键为网站添加黑暗模式

Darkmode.Js 是一款开源项目,只需要添加一段代码,就可以为网站添加夜晚模式/黑暗模式/夜间模式/护眼模式

该库使用 cssmix-blend-mode将暗模式带到您的任何网站。只需复制粘贴代码段,您将获得一个小部件来打开和关闭暗模式。您也可以在没有小部件的情况下以编程方式使用它。该插件是轻量级的,内置于​​ VanillaJS。它还默认使用本地存储,因此您的最后设置将被记住!

使用的方法非常简单,将下面代码添加到你的 html 页面中:

<script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.5.7/lib/darkmode-js.min.js"></script>
<script>
  function addDarkmodeWidget() {
    new Darkmode().showWidget();
  }
  window.addEventListener('load', addDarkmodeWidget);
</script>

官方还提供了WordPress 插件、Drupal 插件、Nuxt.js 模块版本,有兴趣的可以去了解一下

- THE END -

慢慢

8月09日19:23

最后修改:2022年8月9日
0

非特殊说明,本博所有文章均为博主原创。

共有 0 条评论