zoukankan      html  css  js  c++  java
  • 愿一切安好!

    Hexo 静态博客 完整支持特殊日子黑白悼念,愿生者坚强,逝者安息!

    方法 1

    静态方法,直接在模板文件中添加 CSS 样式:

    <style>
    html {
      FILTER: gray;
      -webkit-filter: grayscale(100%);
    }
    </style>
    

    方法 2

    动态方法,可在 _config.yml 中进行配置多个日期:

    grieve:
      - '5-12'
      - '9-18'
      - '2020-4-4'
    

    页面模板如 footer.ejs 中:

    <script type="text/javascript" src="/js/grieve.js"></script>
    <% if (config.grieve) { %>
        <script>
            grieveIfNeed('<%= config.grieve %>')
        </script>
    <% } %>
    

    创建 JS 文件 grieve.js 放到 js 文件夹下:

    grieveIfNeed = function (dateList) { 
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        var dateArray = dateList.split(',')
        
        for(i = 0; i < dateArray.length; i++){
            if(year + '-' + month +'-' + day === dateArray[i] || month +'-' + day === dateArray[i]){
                var style = document.createElement("style");
                style.type = "text/css";
                try{
                  style.appendChild(document.createTextNode("html{FILTER:gray;-webkit-filter:grayscale(100%);}"));
                }catch(ex){
                  style.styleSheet.cssText = "html{FILTER:gray;-webkit-filter:grayscale(100%);}";
                }
                var head = document.getElementsByTagName("head")[0];
                head.appendChild(style);
            }
        }
    }
    

    最后

    团结让我们的民族延绵不息,缅怀让我们的英雄永垂不朽!

  • 相关阅读:
    十进制转换成二进制列表
    openssl生成RSA格式的公私钥,并转为pkcs8格式
    yum安装报错:Failure when receiving data from the peer
    springboot配置swagger
    Impala配置HA-Nginx
    如何安装windows7
    MySQL数据实时增量同步到Kafka
    ElasticSearch-SQL 安装和使用
    部署nexus服务
    maven发布jar包到nexus
  • 原文地址:https://www.cnblogs.com/renyuzhuo/p/12631059.html
Copyright © 2011-2022 走看看