博客园美化修饰

文中使用到的样式皆为本人在网络中收集整合而来，如有不妥请联系我进行更正

在修饰博客园时使用到的JS以及其他文件可以上传到博客园的文件管理中进行引用

指针样式修改

可以通过CSS修改博客园中的指针样式，效果如图所示：

可以直接将下面这段代码放到页面定制CSS代码处，也可以将文件下载上传至自己空间在进行引用：

body {
    cursor: url(https://blog-static.cnblogs.com/files/hanzhe/cursor.ico),auto;
}

背景线条

页面背景中一个个的小点点，靠近后就会产生线条，拥有鼠标吸附的效果：

在页脚HTML代码中添加如下JS即可实现效果

<!--
  color：线条颜色
  opacity：线条透明度，0为全透明，1为不透明
  count：颗粒总数量，建议100左右，多了页面会卡
  zindex：显示的层级
-->
<script src="https://blog-static.cnblogs.com/files/hanzhe/bg-line.js" color="139,139,139" opacity="1" count="80" zindex="-2"></script>

鼠标单击效果

单击烟花特效

效果如图所示：

页脚HTML代码中添加如下代码即可

<script src="https://blog-static.cnblogs.com/files/hanzhe/click-fireworks.js"></script>

单击文字悬浮

效果图如下所示：

页脚HTML代码中添加如下代码即可，这里建议直接将代码放进去方便随时修改文字，或者直接上传引用也可以：

<script>
    var a_idx = 0;
    jQuery(document).ready(function ($) {
        $("body").click(function (e) {
            // 这里就是页面中循环显示的文字了，自定义替换即可
            var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善");
            var $i = $("<span style='user-select: none; font-size: 15px'/>").text(a[a_idx]);
            a_idx = (a_idx + 1) % a.length;
            var x = e.pageX,
                y = e.pageY;
            $i.css({
                "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
                "top": y - 20,
                "left": x,
                "position": "absolute",
                "font-weight": "bold",
                "color": "#ff6651"
            });
            $("body").append($i);
            $i.animate({
                "top": y - 180,
                "opacity": 0
            },
                1500,
                function () {
                    $i.remove();
                });
        });
    });
</script>

单击爱心效果

效果图如下所示：

页脚HTML代码中添加如下代码即可

<script src="https://blog-static.cnblogs.com/files/hanzhe/click-heart.js"></script>

L2Dwidget看板娘

在页面角落里放一个小可爱！在页脚HTML代码中添加如下代码即可

<!-- JS引用 -->
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script>
    // 初始化看板娘
    L2Dwidget.init({
        "model": {
            // 引用的目标模型
            jsonPath: "https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json",
            "scale": 1
        },
        "display": {
            // left，right分别代表左下角和右下角
            "position": "right",
            // 模型大小
            "width": 120,
            "height": 220,
            // h：底部边距，v：两侧边距
            "hOffset": 0,
            "vOffset": 0
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 0.7,
            "opacityOnHover": 0.2
        }
    });
</script>

收集到的模型以及预览图，替换掉上面的jsonPath即可

<!--
  黑猫：https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json
  白猫：https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json
  茶杯狗：https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json
  动漫人物1：https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json
  动漫人物2：https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json
  动漫人物3：https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json
-->