（二）Hexo-个人之博客主题美化

本文以作者blinkfox的matery主题为例，对主题的部分地方进行优化，进行了一些美化。

没有博客？

Github + Hexo 搭建个人博客超详细教程

获取我配置好的主题？

git clone git@github.com:MUYIio/Hexo-matery-Themes.git

须知： 不同的Hexo主题的美化方式可能存在一些差异，但也相差无几，把源代码放在合适的位置就可以。

前提条件： 进行博客主题美化前需要了解Hexo博客的目录结构，主题的目录结构！请阅读官方文档。了解 HTML、CSS、JS，了解 CSS 预处理语言 Sass、Less、Stylus,有一定的前端知识最好。

添加雪花飘落效果

效果预览：

方法：在themes/matery/source/libs/others下新建文件snow.js，并插入如下代码：

/*样式一*/
(function($){
   
    $.fn.snow = function(options){
   
    var $flake = $('<div id="snowbox" />').css({
   'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&#10052;'),
    documentHeight  = $(document).height(),
    documentWidth   = $(document).width(),
    defaults = {
   
        minSize     : 10,
        maxSize     : 20,
        newOn       : 1000,
        flakeColor  : "#AFDAEF" /* 此处可以定义雪花颜色，若要白色可以改为#FFFFFF */
    },
    options = $.extend({
   }, defaults, options);
    var interval= setInterval( function(){
   
    var startPositionLeft = Math.random() * documentWidth - 100,
    startOpacity = 0.5 + Math.random(),
    sizeFlake = options.minSize + Math.random() * options.maxSize,
    endPositionTop = documentHeight - 200,
    endPositionLeft = startPositionLeft - 500 + Math.random() * 500,
    durationFall = documentHeight * 10 + Math.random() * 5000;
    $flake.clone().appendTo('body').css({
   
        left: startPositionLeft,
        opacity: startOpacity,
        'font-size': sizeFlake,
        color: options.flakeColor
    }).animate({
   
        top: endPositionTop,
        left: endPositionLeft,
        opacity: 0.2
    },durationFall,'linear',function(){
   
        $(this).remove()
    });
    }, options.newOn);
    };
})(jQuery);
$(function(){
   
    $.fn.snow({
    
        minSize: 5, /* 定义雪花最小尺寸 */
        maxSize: 50,/* 定义雪花最大尺寸 */
        newOn: 300  /* 定义密集程度，数字越小越密集 */
    });
});
/*样式二*/
/* 控制下雪 */
function snowFall(snow) {
   
    /* 可配置属性 */
    snow = snow || {
   };
    this.maxFlake = snow.maxFlake || 200;   /* 最多片数 */
    this.flakeSize = snow.flakeSize || 10;  /* 雪花形状 */
    this.fallSpeed = snow.fallSpeed || 1;   /* 坠落速度 */