首页 > 其他 > 详细

愿一切安好!

时间:2020-04-04 13:48:55      阅读:81      评论:0      收藏:0      [点我收藏+]

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);
        }
    }
}

最后

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

愿一切安好!

原文:https://www.cnblogs.com/renyuzhuo/p/12631059.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!