废话不多说,直接上代码:

<script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.4.0/lib/darkmode-js.min.js"></script>
<script>
var now = new Date();
var hour = now.getHours();
if(18 < hour || hour < 6){ // 每天晚上6点到早上6点设置为暗黑模式
    var options = {
      bottom: '32px', // default: '32px'
      time: '0.5s', // default: '0.3s'
      mixColor: '#fff', // default: '#fff'
      backgroundColor: '#fff',  // default: '#fff'
      buttonColorDark: '#100f2c',  // default: '#100f2c'
      buttonColorLight: '#fff', // default: '#fff'
      saveInCookies: true, // default: true,
      label: '🌓', // default: ''
      autoMatchOsTheme: true // default: true
    };

    new Darkmode(options).showWidget();
    $(".darkmode-toggle").css("z-index","9999999999");
    $(".darkmode-layer").css("position","fixed");
    $(".darkmode-layer").css("z-index","9999999999");
}
</script>

参考 typecho 插件源码:

<?php
/**
 * 基于darkmode-js的夜间模式插件 晚18点-清晨6点自动启动
 *
 * @package DrakNight
 * @author 术与道
 * @version 1.0.0
 * @link http://www.shuyudao.top
 *
 * */
class DrakNight_Plugin implements Typecho_Plugin_Interface{

    public static function activate()
    {
        Typecho_Plugin::factory('Widget_Archive')->header = array("DrakNight_Plugin", 'run');
        return _t('启动成功');
    }

    public static function deactivate(){}

    public static function config(Typecho_Widget_Helper_Form $form)
    {
    }

    public static function personalConfig(Typecho_Widget_Helper_Form $form){}

    public static function run($foo){

        echo "<script src=\"https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js\"></script><script src=\"https://cdn.jsdelivr.net/npm/darkmode-js@1.4.0/lib/darkmode-js.min.js\"></script>
<script>
 
  window.onload = function(){

    now = new Date(),hour = now.getHours() 

      if(18<hour||hour<6){
          var options = {
          bottom: '64px', // default: '32px'
          time: '0.5s', // default: '0.3s'
          mixColor: '#fff', // default: '#fff'
          backgroundColor: '#fff',  // default: '#fff'
          buttonColorDark: '#100f2c',  // default: '#100f2c'
          buttonColorLight: '#fff', // default: '#fff'
          saveInCookies: true, // default: true,
          label: '🌓', // default: ''
          autoMatchOsTheme: true // default: true
        }

        new Darkmode(options).showWidget();
          $(\".darkmode-toggle\").css(\"z-index\",\"9999999999\");
          $(\".darkmode-layer\").css(\"position\",\"fixed\");
          $(\".darkmode-layer\").css(\"z-index\",\"9999999999\");
      }
  }
</script>";
    }

}

标签: css, typecho

添加新评论