本文主要是介绍愿一切安好!,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
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);}}
}
最后
团结让我们的民族延绵不息,缅怀让我们的英雄永垂不朽!
这篇关于愿一切安好!的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!