Hexo 靜態博客 完整支持特殊日子黑白悼念,願生者堅強,逝者安息!javascript
靜態方法,直接在模板文件中添加 CSS 樣式:css
<style> html { FILTER: gray; -webkit-filter: grayscale(100%); } </style>
動態方法,可在 _config.yml 中進行配置多個日期:html
grieve: - '5-12' - '9-18' - '2020-4-4'
頁面模板如 footer.ejs 中:java
<script type="text/javascript" src="/js/grieve.js"></script> <% if (config.grieve) { %> <script> grieveIfNeed('<%= config.grieve %>') </script> <% } %>
建立 JS 文件 grieve.js 放到 js 文件夾下:web
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); } } }
團結讓咱們的民族延綿不息,緬懷讓咱們的英雄永垂不朽!app