魔改特效一

首页小猫滚动条、首页转动的小人、首页侧边栏公众号、首页侧边栏电子时钟、首页会动的飞机、右键菜单、自定义页脚、评论功能、外挂标签、星空背景和流星特效、音乐播放器

首页分类磁铁

【冰卡诺2.0】、【akilar魔改4.0】

最新版可借鉴【akilar魔改4.0】，直接使用命令实现分类磁铁的魔改

  1. 安装依赖，前往博客根目录，打开cmd命令窗口执行如下命令：
    1
    npm install hexo-butterfly-categories-card --save

  2. 在主题配置文件_config.butterfly.yml添加配置

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    categoryBar:
      enable: true # 开关
      priority: 5 #过滤器优先权
      enable_page: / # 应用页面
      layout: # 挂载容器类型
        type: id
        name: recent-posts
        index: 0
      column: odd # odd：3列 | even：4列
      row: 1 #显示行数，默认两行，超过行数切换为滚动显示
      message:
        - descr: Ubuntu指南
          cover: https://assets.akilar.top/image/cover1.webp
        - descr: 玩转Win10
          cover: https://assets.akilar.top/image/cover2.webp
        - descr: 长篇小说连载
          cover: https://assets.akilar.top/image/cover3.webp
        - descr: 个人日记
          cover: https://assets.akilar.top/image/cover4.webp
        - descr: 诗词歌赋
          cover: https://assets.akilar.top/image/cover5.webp
        - descr: 杂谈教程
          cover: https://assets.akilar.top/image/cover6.webp
      custom_css: https://npm.elemecdn.com/hexo-butterfly-categories-card@1.0.0/lib/categorybar.css

  3. 参数释义

参数 备选值/类型 释义
priority number 【可选】过滤器优先级，数值越小，执行越早，默认为10，选填
enable true/false 【必选】控制开关
enable_page path/all 【可选】填写想要应用的页面的相对路径（即路由地址）,如根目录就填’/‘,分类页面就填’/categories/‘。若要应用于所有页面，就填’all’，默认为’/‘
layout.type id/class 【可选】挂载容器类型，填写id或class，不填则默认为id
layout.name text 【必选】挂载容器名称
layout.index 0和正整数 【可选】前提是layout.type为class，因为同一页面可能有多个class，此项用来确认究竟排在第几个顺位
column odd/even 【可选】显示列数，考虑到比例问题，只提供3列和4列，odd为3列， even为4列
row number 【可选】显示行数，默认两行，超过行数切换为滚动显示
message.descr text 分类描述,需要和你自己的文章分类一一对应。
message.cover url 分类背景,需要和你自己的文章分类一一对应。
custom_css url 【可选】自定义样式，会替换默认的css链接，可以下载文档给出的cdn链接后自主修改

首页小猫下拉滚动条

  1. 制作一个盛放内容的盒子，在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/header/index.pug最后一行加入如下代码：
    1
    #myscoll
    其实随便放在哪里都行，但千万别放在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/header/index.pug的末尾（如果用了自定义右键功能的话，记住千万别放到这里！！会影响右键菜单的位置）。
  2. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/js文件夹下新建一个cat.js，将以下代码复制到文件中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    if (document.body.clientWidth > 992) {
        function getBasicInfo() {
            /* 窗口高度 */
            var ViewH = $(window).height();
            /* document高度 */
            var DocH = $("body")[0].scrollHeight;
            /* 滚动的高度 */
            var ScrollTop = $(window).scrollTop();
            /* 可滚动的高度 */
            var S_V = DocH - ViewH;
            var Band_H = ScrollTop / (DocH - ViewH) * 100;
            return {
                ViewH: ViewH,
                DocH: DocH,
                ScrollTop: ScrollTop,
                Band_H: Band_H,
                S_V: S_V
            }
        };
        function show(basicInfo) {
            if (basicInfo.ScrollTop > 0.001) {
                $(".neko").css('display', 'block');
            } else {
                $(".neko").css('display', 'none');
            }
        }
        (function ($) {
            $.fn.nekoScroll = function (option) {
                // 默认配置
                var defaultSetting = {
                    top: '0',
                    scroWidth: 6 + 'px',
                    z_index: 9999,
                    zoom: 0.9,
                    borderRadius: 5 + 'px',
                    right: 60 + 'px',
                    nekoImg: "https://bu.dusays.com/2022/07/20/62d812db74be9.png",
                    hoverMsg: "喵喵喵~",
                    color: "#6f42c1",
                    during: 500,
                    blog_body: "body",
                };
                var setting = $.extend(defaultSetting, option);
                var getThis = this.prop("className") !== "" ? "." + this.prop("className") : this.prop("id") !== "" ? "#" +
                    this.prop("id") : this.prop("nodeName");
                if ($(".neko").length == 0) {
                    this.after("<div class=\"neko\" id=" + setting.nekoname + " data-msg=\"" + setting.hoverMsg + "\"></div>");
                }
                let basicInfo = getBasicInfo();
                $(getThis)
                    .css({
                        'position': 'fixed',
                        'width': setting.scroWidth,
                        'top': setting.top,
                        'height': basicInfo.Band_H * setting.zoom * basicInfo.ViewH * 0.01 + 'px',
                        'z-index': setting.z_index,
                        'background-color': setting.bgcolor,
                        "border-radius": setting.borderRadius,
                        'right': setting.right,
                        'background-image': 'url(' + setting.scImg + ')',
                        'background-image': '-webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent)', 'border-radius': '2em',
                        'background-size': 'contain'
                    });
                $("#" + setting.nekoname)
                    .css({
                        'position': 'fixed',
                        'top': basicInfo.Band_H * setting.zoom * basicInfo.ViewH * 0.01 - 50 + 'px',
                        'z-index': setting.z_index * 10,
                        'right': setting.right,
                        'background-image': 'url(' + setting.nekoImg + ')',
                    });
                show(getBasicInfo());
                $(window)
                    .scroll(function () {
                        let basicInfo = getBasicInfo();
                        show(basicInfo);
                        // 主体【线】移动
                        $(getThis)
                            .css({
                                'position': 'fixed',
                                'width': setting.scroWidth,
                                'top': setting.top,
                                'height': basicInfo.Band_H * setting.zoom * basicInfo.ViewH * 0.01 + 'px',
                                'z-index': setting.z_index,
                                'background-color': setting.bgcolor,
                                "border-radius": setting.borderRadius,
                                'right': setting.right,
                                'background-image': 'url(' + setting.scImg + ')',
                                'background-image': '-webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent)', 'border-radius': '2em',
                                'background-size': 'contain'
                            });
                        // 主体【图案】移动
                        $("#" + setting.nekoname)
                            .css({
                                'position': 'fixed',
                                'top': basicInfo.Band_H * setting.zoom * basicInfo.ViewH * 0.01 - 50 + 'px',
                                'z-index': setting.z_index * 10,
                                'right': setting.right,
                                'background-image': 'url(' + setting.nekoImg + ')',
                            });
                        // 触底或离开时的弹窗控制
                        if (basicInfo.ScrollTop == basicInfo.S_V) {
                            // 触底
                            $("#" + setting.nekoname)
                                .addClass("showMsg") //class名
                                .attr("data-msg", setting.endMsg);
                        } else {
                            // 鼠标触碰
                            $("#" + setting.nekoname)
                                .removeClass("showMsg"); //class名
                            $("#" + setting.nekoname)
                                .attr("data-msg", setting.hoverMsg);
                        }
                    });
                this.click(function (e) {
                    btf.scrollToDest(0, 500)
                });
                $("#" + setting.nekoname)
                    .click(function () {
                        btf.scrollToDest(0, 500)
                    });
                return this;
            }
        })(jQuery);

        $(document).ready(function () {
            //部分自定义
            $("#myscoll").nekoScroll({
                bgcolor: 'rgb(0 0 0 / .5)', //背景颜色，没有绳子背景图片时有效
                borderRadius: '2em',
                zoom: 0.9
            }
            );
            //自定义（去掉以下注释，并注释掉其他的查看效果）
            /*
            $("#myscoll").nekoScroll({
                nekoname:'neko-10001', //nekoname，相当于id
                nekoImg:'img/猫咪.png', //neko的背景图片 参考上面的默认配置
                scImg:"img/绳1.png", //绳子的背景图片 参考上面的默认配置
                bgcolor:'rgb(143,143,143,0.3)', //背景颜色，没有绳子背景图片时有效 
                zoom:0.9, //绳子长度的缩放值
                hoverMsg: '你想干嘛', //鼠标浮动到neko上方的对话框信息
                endMsg: '返回顶部', //滑动到底部后的对话框信息
                right:'100px', //距离页面右边的距离
                fontFamily:'楷体', //对话框字体
                fontSize:'14px', //对话框字体的大小
                color:'#1e90ff', //对话框字体颜色
                scroWidth:'8px', //绳子的宽度
                z_index:100, //不用解释了吧
                during:1200, //从顶部到底部滑动的时长
            });
            */
        })
    }
  3. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/css文件夹下新建一个cat.css
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    body::-webkit-scrollbar {
        width: 0;
    }

    .neko {
        width: 64px;
        height: 64px;
        background-image: url("https://bu.dusays.com/2022/07/20/62d812db74be9.png");
        position: absolute;
        right: 32px;
        background-repeat: no-repeat;
        background-size: contain;
        transform: translateX(50%);
        cursor: pointer;
        font-family: tzy;
        font-weight: 600;
        font-size: 16px;
        color: #6f42c1;
        display: none;
    }

    .neko::after {
        display: none;
        width: 100px;
        height: 100px;
        background-image: url("https://bu.dusays.com/2022/07/20/62d812d95e6f5.png");
        background-size: contain;
        z-index: 9999;
        position: absolute;
        right: 50%;
        text-align: center;
        line-height: 100px;
        top: -115%;

    }

    .neko.showMsg::after {
        content: attr(data-msg);
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .neko:hover::after {
        content: attr(data-msg);
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .neko.fontColor::after {
        color: #333;
    }

    /**
     * @description: 滚动条样式  跟猫二选一
     */
    @media screen and (max-width:992px) {
        ::-webkit-scrollbar {
            width: 8px !important;
            height: 8px !important
        }

        ::-webkit-scrollbar-track {
            border-radius: 2em;
        }

        ::-webkit-scrollbar-thumb {
            background-color: rgb(255 255 255 / .3);
            background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent);
            border-radius: 2em
        }

        ::-webkit-scrollbar-corner {
            background-color: transparent
        }
    }
  4. 在主题配置文件_config.butterfly.yml中引入cat.js和cat.css。
    1
    2
    3
    4
    5
    6
    inject:
      head:
        - <link rel="stylesheet" href="/css/cat.css">
      bottom:
        - <script defer src="https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js"></script>
        - <script defer data-pjax src="/js/cat.js"></script>
  5. 最后重新编译运行，即可看见效果

首页右侧会转动的小人

在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/widget/card_announcement.pug下添加如下部分代码。

注意: 将代码复制到card_announcement.pug文件以后，不难发现会有重复的一段代码。你要做的一步操作是，删除重复的代码（优先保留你主题版本原有的代码）， 这里之所以没用 Diff 代码块，是因为怕删除【+】号的时候在格式上特别容易出错。


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
if theme.aside.card_announcement.enable
  .card-widget.card-announcement
    .item-headline
      i.fas.fa-bullhorn.card-announcement-animation
      span= _p('aside.card_announcement')
    .announcement_content!= theme.aside.card_announcement.content
  .xpand(style='height:200px;')
    canvas.illo(width='800' height='800' style='max-width: 200px; max-height: 200px; touch-action: none; width: 640px; height: 640px;')
script(src='https://npm.elemecdn.com/ethan4116-blog/lib/js/other/two-people/twopeople1.js')
script(src='https://npm.elemecdn.com/ethan4116-blog/lib/js/other/two-people/zdog.dist.js')
script#rendered-js(src='https://npm.elemecdn.com/ethan4116-blog/lib/js/other/two-people/twopeople.js')
style.
 .card-widget.card-announcement {
 margin: 0;
 align-items: center;
 justify-content: center;
 text-align: center;
 }
 canvas {
 display: block;
 margin: 0 auto;
 cursor: move;
 }

首页侧边栏公众号

  1. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/widget文件夹下新建一个card_wx.pug文件，
  2. 将以下代码复制到文件中。
    1
    2
    3
    4
    5
    #card-wechat.card-widget.tzy-right-widget
        #flip-wrapper
          #flip-content
            .face
            .back.face
  3. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/widget/index.pug中引入上一步中创建的一个card_wx.pug文件。
  4. 将以下代码复制到自定义的custom.css中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    /* 公众号 Start */
    [data-theme='light'] #aside-content .card-widget#card-wechat {
        background: #49b1f5 !important;
    }

    #aside-content .card-widget#card-wechat {
        background: var(--card-bg);
        display: flex;
        justify-content: center;
        align-content: center;
        padding: 0;
        cursor: pointer !important;
        border: none;
        height: 110px;
    }

    /* 如果你设置了aside 的 mobile 为 false，记得放开下面这段注释；
       如果你设置了aside 的 mobile 为 true ，不需要改动。 */

    /* @media screen and (max-width: 768px) {
        #aside-content .card-widget#card-wechat {
            display: none !important;
        }
    } */
    @media screen and (min-width: 1300px) {
        #aside-content .card-widget {
            margin-top: 1rem;
        }
    }
    #flip-wrapper {
        -webkit-perspective: 1000;
        perspective: 1000;
        position: relative;
        width: 235px;
        height: 110px;
        z-index: 1;
    }
    #flip-wrapper:hover #flip-content {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
    #flip-content {
        width: 100%;
        height: 100%;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
        transition: cubic-bezier(0, 0, 0, 1.29) 0.3s;
    }
    .face {
        position: absolute;
        width: 100%;
        height: 100%;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        background: url(https://smart-blog.oss-cn-wulanchabu.aliyuncs.com/image/2023/03/wechat-public_face.png) center center no-repeat;
        background-size: 100%;
    }
    .back.face {
        display: block;
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
        box-sizing: border-box;
        background: url(https://smart-blog.oss-cn-wulanchabu.aliyuncs.com/image/2023/03/wechat-public_back.png) center center no-repeat;
        background-size: 100%;
    }

    /* 公众号 End */

    此段css中，需要将background: #49b1f5 !important中的#49b1f5换成你自己的主题色。
    另外还需要将 https://bu.dusays.com/2022/10/30/635e9c6a228a3.png 这个图片中的二维码部分换成你自己公众号的二维码。

  5. 最后重新编译运行，即可看见效果。

首页侧边栏电子时钟

  1. 卸载原版电子钟，,在博客根目录下打开终端，运行以下指令：
    1
    2
    # 卸载原版电子钟
    npm uninstall hexo-butterfly-clock
  2. 安装新版插件,在博客根目录下打开终端，运行以下指令：
    1
    npm install hexo-butterfly-clock-anzhiyu --save
  3. 添加配置信息，以下为写法示例在站点配置文件_config.butterfly.yml中添加
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    # electric_clock
    # see https://anzhiy.cn/posts/fc18.html
    electric_clock:
      enable: true # 开关
      priority: 5 #过滤器优先权
      enable_page: all # 应用页面
      exclude:
      # - /posts/
      # - /about/
      layout: # 挂载容器类型
        type: class
        name: sticky_layout
        index: 0
      loading: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/loading.gif #加载动画自定义
      clock_css: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/clock.min.css
      clock_js: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/clock.min.js
      ip_api: https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0
      qweather_key: # 和风天气key
      gaud_map_key: # 高得地图web服务key
      default_rectangle: false # 开启后将一直显示rectangle位置的天气，否则将获取访问者的地理位置与天气
      rectangle: 112.982279,28.19409 # 获取访问者位置失败时会显示该位置的天气，同时该位置为开启default_rectangle后的位置

    其中qweather_key和gaud_map_key最好自己去申请对应的api key，默认使用我自己的，可能会被限制，不保证可靠性

  4. 参数释义
参数 备选值/类型 是否必需 描述
priority number 可选 过滤器优先级，数值越小，执行越早，默认为 10，选填
enable true/false 必选 控制开关
enable_page path/all 可选 填写想要应用的页面的相对路径（即路由地址）,如根目录就填’/‘,分类页面就填’/categories/‘。若要应用于所有页面，就填’all’，默认为 all
exclude path 可选 填写想要屏蔽的页面，可以多个。写法见示例。原理是将屏蔽项的内容逐个放到当前路径去匹配，若当前路径包含任一屏蔽项，则不会挂载。
layout.type id/class 可选 挂载容器类型，填写 id 或 class，不填则默认为 id
layout.name text 必选 挂载容器名称
layout.index 0 和正整数 可选 前提是 layout.type 为 class，因为同一页面可能有多个 class，此项用来确认究竟排在第几个顺位
loading URL 可选 电子钟加载动画的图片
clock_css URL 可选 电子钟样式 CDN 资源
clock_js URL 可选 电子钟执行脚本 CDN 资源
ip_api URL 可选 获取时钟 IP 的 API
qweather_key text 可选 和风天气 key
gaud_map_key text 可选 高得地图 web 服务 key
default_rectangle text 可选 开启后将一直显示 rectangle 位置的天气，否则将获取访问者的地理位置与天气
rectangle text 可选 获取访问者位置失败时会显示该位置的天气，同时该位置为开启 default_rectangle 后的位置

首页会动的飞机

  1. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/header文件夹下新建一个plane.pug文件。
    将以下代码复制到文件中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    209
    210
    211
    212
    213
    214
    215
    216
    217
    218
    219
    220
    221
    222
    223
    224
    225
    226
    227
    228
    229
    230
    231
    232
    233
    234
    235
    236
    237
    238
    239
    240
    241
    242
    243
    244
    245
    246
    247
    248
    249
    250
    251
    252
    253
    254
    255
    256
    257
    258
    259
    260
    261
    262
    263
    264
    265
    266
    267
    268
    269
    270
    271
    272
    273
    274
    275
    276
    277
    278
    279
    280
    281
    282
    283
    284
    285
    286
    287
    288
    289
    290
    291
    292
    293
    294
    295
    296
    297
    298
    299
    300
    301
    302
    303
    304
    305
    306
    307
    308
    309
    310
    311
    312
    313
    314
    315
    316
    317
    318
    319
    320
    321
    322
    323
    324
    325
    326
    327
    328
    329
    330
    331
    332
    333
    334
    335
    336
    337
    338
    339
    340
    341
    342
    343
    344
    345
    346
    347
    348
    349
    350
    351
    352
    353
    354
    355
    356
    357
    358
    359
    360
    361
    362
    363
    364
    365
    366
    367
    368
    369
    370
    371
    372
    373
    374
    375
    376
    377
    378
    379
    380
    381
    382
    383
    384
    385
    386
    387
    388
    389
    390
    391
    392
    393
    394
    395
    396
    397
    398
    399
    400
    401
    402
    403
    404
    405
    406
    407
    408
    409
    410
    411
    412
    413
    414
    415
    416
    417
    418
    419
    420
    421
    422
    423
    424
    425
    426
    427
    428
    429
    430
    431
    432
    433
    434
    435
    436
    437
    438
    439
    440
    441
    442
    443
    444
    445
    446
    447
    448
    449
    450
    451
    452
    453
    454
    455
    456
    457
    458
    459
    460
    461
    462
    463
    464
    465
    466
    467
    468
    469
    470
    471
    472
    473
    474
    475
    476
    477
    478
    479
    480
    481
    482
    483
    484
    485
    486
    487
    488
    489
    490
    491
    492
    493
    494
    495
    496
    497
    498
    499
    500
    501
    502
    503
    #drone
      .container
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .trigger
        .monitor
          .opening
            .camera.o-x
              .camera.o-y
                .camera.o-z
                  .awing
                    .stars
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                      .star
                    .fly.o-x
                      .fly.o-y
                        .fly.o-z
                          .free_bounce
                            .free_rotate
                              .body
                                .cockpit
                                  .under
                                  .back
                                  .left
                                  .right
                                  .edge_left
                                  .edge_right
                                  .boosts
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                    .boost
                                .wing_left
                                  .under
                                  .back
                                  .left
                                  .right
                                .wing_right
                                  .under
                                  .back
                                  .left
                                  .right
  2. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/header/index.pug中引入上一步中创建的plane.pug文件。
    1
    2
    //- 引入首页飞机
    !=partial('includes/header/plane', {}, {cache: true})
    跟#site-info、#scroll-down同级。
  3. 在主题配置文件_config.butterfly.yml中引入plane.css。
    1
    2
    3
    inject:
      head:
        - <link rel="stylesheet" href="https://npm.elemecdn.com/ethan4116-blog/lib/css/plane_v2.css">
  4. 最后重新编译运行，即可看见效果。

首页樱花飘落效果

在主题配置文件_config.butterfly.yml的inject配置项中bottom下引入sakura.js即可

1
2
3
4
inject:
  bottom:
   # 樱花飘落效果
   # - <script async src="https://npm.elemecdn.com/tzy-blog/lib/js/other/sakura.js"></script>

首页星空背景和流星特效

注意：有可能有冲突，当前切换到夜间模式展示效果

  1. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/js目录下新建一个universe.js，输入以下代码：
    1
    2
    function dark() {window.requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame;var n,e,i,h,t=.05,s=document.getElementById("universe"),o=!0,a="180,184,240",r="226,225,142",d="226,225,224",c=[];function f(){n=window.innerWidth,e=window.innerHeight,i=.216*n,s.setAttribute("width",n),s.setAttribute("height",e)}function u(){h.clearRect(0,0,n,e);for(var t=c.length,i=0;i<t;i++){var s=c[i];s.move(),s.fadeIn(),s.fadeOut(),s.draw()}}function y(){this.reset=function(){this.giant=m(3),this.comet=!this.giant&&!o&&m(10),this.x=l(0,n-10),this.y=l(0,e),this.r=l(1.1,2.6),this.dx=l(t,6*t)+(this.comet+1-1)*t*l(50,120)+2*t,this.dy=-l(t,6*t)-(this.comet+1-1)*t*l(50,120),this.fadingOut=null,this.fadingIn=!0,this.opacity=0,this.opacityTresh=l(.2,1-.4*(this.comet+1-1)),this.do=l(5e-4,.002)+.001*(this.comet+1-1)},this.fadeIn=function(){this.fadingIn&&(this.fadingIn=!(this.opacity>this.opacityTresh),this.opacity+=this.do)},this.fadeOut=function(){this.fadingOut&&(this.fadingOut=!(this.opacity<0),this.opacity-=this.do/2,(this.x>n||this.y<0)&&(this.fadingOut=!1,this.reset()))},this.draw=function(){if(h.beginPath(),this.giant)h.fillStyle="rgba("+a+","+this.opacity+")",h.arc(this.x,this.y,2,0,2*Math.PI,!1);else if(this.comet){h.fillStyle="rgba("+d+","+this.opacity+")",h.arc(this.x,this.y,1.5,0,2*Math.PI,!1);for(var t=0;t<30;t++)h.fillStyle="rgba("+d+","+(this.opacity-this.opacity/20*t)+")",h.rect(this.x-this.dx/4*t,this.y-this.dy/4*t-2,2,2),h.fill()}else h.fillStyle="rgba("+r+","+this.opacity+")",h.rect(this.x,this.y,this.r,this.r);h.closePath(),h.fill()},this.move=function(){this.x+=this.dx,this.y+=this.dy,!1===this.fadingOut&&this.reset(),(this.x>n-n/4||this.y<0)&&(this.fadingOut=!0)},setTimeout(function(){o=!1},50)}function m(t){return Math.floor(1e3*Math.random())+1<10*t}function l(t,i){return Math.random()*(i-t)+t}f(),window.addEventListener("resize",f,!1),function(){h=s.getContext("2d");for(var t=0;t<i;t++)c[t]=new y,c[t].reset();u()}(),function t(){document.getElementsByTagName('html')[0].getAttribute('data-theme')=='dark'&&u(),window.requestAnimationFrame(t)}()};
    dark()

  2. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/css目录下新建一个universe.css，输入以下代码：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    /* 背景宇宙星光  */
    #universe{
      display: block;
      position: fixed;
      margin: 0;
      padding: 0;
      border: 0;
      outline: 0;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: -1;
    }

  3. 在主题配置文件_config.butterfly.yml的inject配置项中bottom下填入：

    1
    2
    3
    4
    5
    inject:
      bottom:
       # 星空背景
       - <canvas id="universe"></canvas>
       - <script defer src="/js/universe.js"></script>
  4. 在主题配置文件_config.butterfly.yml的inject配置项中head下填入：
    1
    2
    3
    4
    inject:
      head:
       ## 星空背景
       - <link rel="stylesheet" href="/css/universe.css">
  5. 最后重新编译运行，即可看见效果。

右键菜单

Hexo Butterfly基础右键菜单 自定义右键菜单

  1. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes文件夹下新建一个right-menu的文件夹，在此文件夹下新建一个index.pug文件。
    将以下代码复制到文件中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    #rightMenu
        .rightMenu-group.rightMenu-small
            //- 上一页
            .rightMenu-item#menu-backward
                i.fa-solid.fa-arrow-left
            //- 下一页
            .rightMenu-item#menu-forward
                i.fa-solid.fa-arrow-right
            //- 刷新
            .rightMenu-item#menu-refresh
                i.fa-solid.fa-arrow-rotate-right
            //- 首页
            .rightMenu-item#menu-home 
                i.fa-solid.fa-house
        .rightMenu-group.rightMenu-line.hide#menu-text
            .rightMenu-item#menu-copy
                i.fa.fa-copy
                span='复制'
        .rightMenu-group.rightMenu-line.rightMenuArcitle
            a.rightMenu-item.menu-link(href='/archives/')
                i.fa-solid.fa-archive
                span='文章归档'
            a.rightMenu-item.menu-link(href='/categories/')
                i.fa-solid.fa-folder-open
                span='文章分类'
            a.rightMenu-item.menu-link(href='/tags/')
                i.fa-solid.fa-tags
                span='文章标签'
        .rightMenu-group.rightMenu-line.rightMenuNormal
            //- a.rightMenu-item.menu-link#menu-radompage(href='/archives')
            a.rightMenu-item.menu-link#menu-randomPost
                i.fa-solid.fa-shoe-prints
                span='随便逛逛'
            .rightMenu-item#menu-translate
                i.fa-solid.fa-earth-asia
                span='繁简切换'
            .rightMenu-item#menu-darkmode
                i.fa-solid.fa-moon
                span='昼夜切换'
            a.rightMenu-item#menu-readmode
                i.fas.fa-book-open
                span='阅读模式'
        .rightMenu-group.rightMenu-line.rightMenuOther
            a.rightMenu-item#menu-screen
                i.fa.fa-arrows-alt
                span='全屏模式'
            .rightMenu-item#menu-print
                i.fa-solid.fa-print.fa-fw
                span='打印页面'
            .rightMenu-item#menu-scrollToTop
                i.fa.fa-copy
                span='回到顶部'
    #rightmenu-mask
  2. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/layout.pug中引入上一步中创建的index.pug文件。
  3. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/js文件夹下新建一个rightMenu.js，将以下代码复制到文件中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    209
    210
    211
    212
    213
    214
    215
    216
    217
    218
    219
    220
    221
    222
    223
    224
    225
    226
    227
    228
    229
    230
    231
    232
    233
    234
    235
    236
    237
    238
    239
    240
    241
    242
    243
    244
    245
    246
    247
    248
    249
    250
    251
    252
    253
    254
    255
    256
    257
    258
    259
    260
    261
    262
    263
    264
    265
    266
    267
    268
    269
    270
    271
    272
    273
    274
    275
    276
    277
    278
    279
    280
    281
    282
    283
    284
    285
    286
    287
    288
    289
    290
    291
    292
    293
    294
    295
    296
    297
    298
    299
    300
    301
    302
    303
    var rm = {};
    rm.showRightMenu = function (isTrue, x = 0, y = 0) {
        let $rightMenu = $('#rightMenu');
        $rightMenu.css('top', x + 'px').css('left', y + 'px');

        if (isTrue) {
            stopMaskScroll()
            $rightMenu.show();
        } else {
            $rightMenu.hide();
        }
    };
    var rmWidth = $('#rightMenu').width();
    var rmHeight = $('#rightMenu').height();
    rm.reloadrmSize = function () {
        rmWidth = $("#rightMenu").width();
        rmHeight = $("#rightMenu").height()
    };
    window.oncontextmenu = function (event) {
        if (document.body.clientWidth > 768) {
            let pageX = event.clientX + 10;	
            let pageY = event.clientY;
            let $rightMenuNormal = $(".rightMenuNormal");
            let $rightMenuOther = $(".rightMenuOther");
            let $rightMenuReadmode = $("#menu-readmode");
            $rightMenuNormal.show();
            $rightMenuOther.show();
            rm.reloadrmSize();
            if (pageX + rmWidth > window.innerWidth) {
                pageX -= rmWidth;
            }
            if (pageY + rmHeight > window.innerHeight) {
                pageY -= rmHeight;
            }
            rm.showRightMenu(true, pageY, pageX);
            $('#rightmenu-mask').attr('style', 'display: flex');
            return false;
        }
    };

    /**
     * 关闭右键菜单
     */
    function removeRightMenu() {
        rm.showRightMenu(false);
        $('#rightmenu-mask').attr('style', 'display: none');
    }

    /**
     * 屏蔽滚动
     */
    function stopMaskScroll() {
        if (document.getElementById("rightmenu-mask")) {
            let xscroll = document.getElementById("rightmenu-mask");
            xscroll.addEventListener("mousewheel", function (e) {
                removeRightMenu();
            }, false);
        };
        if (document.getElementById("rightMenu")) {
            let xscroll = document.getElementById("rightMenu");
            xscroll.addEventListener("mousewheel", function (e) {
                removeRightMenu();
            }, false);
        }
    }
    /**
     * 昼夜切换
     */
    function switchDarkMode() {
        removeRightMenu();
        // const nowMode = document.documentElement.getAttribute('data-theme') === 'light' ? 'light' : 'dark'
        const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
        if (nowMode === 'light') {
            activateDarkMode();
            saveToLocal.set('theme', 'dark', 2);
            GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night);
        } else {
            activateLightMode();
            saveToLocal.set('theme', 'light', 2);
            GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day);
        }
        typeof utterancesTheme === 'function' && utterancesTheme();
        typeof FB === 'object' && window.loadFBComment();
        window.DISQUS && document.getElementById('disqus_thread').children.length && setTimeout(() => window.disqusReset(), 200);
    };
    /* eslint-disable no-undef */
    document.addEventListener('DOMContentLoaded', function () {
        translateInitialization();
        document.addEventListener('pjax:complete', translateInitialization);
    });
    var translate = GLOBAL_CONFIG.translate;
    var snackbarData = GLOBAL_CONFIG.Snackbar;
    var defaultEncoding = translate.defaultEncoding; /* 网站默认语言，1: 繁体中文, 2: 简体中文 */
    var translateDelay = translate.translateDelay; /* 延迟时间,若不在前, 要设定延迟翻译时间, 如100表示100ms,默认为0 */
    var msgToTraditionalChinese = translate.msgToTraditionalChinese; /* 此处可以更改为你想要提示的文字 */
    var msgToSimplifiedChinese = translate.msgToSimplifiedChinese; /* 同上，但两处均不建议更改 */
    var currentEncoding = defaultEncoding;
    var targetEncodingCookie = 'translate-chn-cht';
    var targetEncoding =
        saveToLocal.get(targetEncodingCookie) === undefined
            ? defaultEncoding
            : Number(saveToLocal.get('translate-chn-cht'));
    var translateButtonObject
    var isSnackbar = GLOBAL_CONFIG.Snackbar !== undefined;
    function translateText(txt) {
        if (txt === '' || txt == null) return '';
        if (currentEncoding === 1 && targetEncoding === 2) return Simplized(txt);
        else if (currentEncoding === 2 && targetEncoding === 1) { return Traditionalized(txt) } else return txt;
    }
    function translateBody(fobj) {
        let objs;
        if (typeof fobj === 'object') objs = fobj.childNodes;
        else objs = document.body.childNodes;
        for (let i = 0; i < objs.length; i++) {
            const obj = objs.item(i);
            if (
                '||BR|HR|'.indexOf('|' + obj.tagName + '|') > 0 ||
                obj === translateButtonObject
            ) { continue }
            if (obj.title !== '' && obj.title != null) { obj.title = translateText(obj.title) };
            if (obj.alt !== '' && obj.alt != null) obj.alt = translateText(obj.alt);
            if (obj.placeholder !== '' && obj.placeholder != null) obj.placeholder = translateText(obj.placeholder);
            if (
                obj.tagName === 'INPUT' &&
                obj.value !== '' &&
                obj.type !== 'text' &&
                obj.type !== 'hidden'
            ) { obj.value = translateText(obj.value) }
            if (obj.nodeType === 3) obj.data = translateText(obj.data);
            else translateBody(obj);
        }
    }
    function translatePage() {
        if (targetEncoding === 1) {
            currentEncoding = 1;
            targetEncoding = 2;
            saveToLocal.set(targetEncodingCookie, targetEncoding, 2);
            translateBody();
            if (isSnackbar) btf.snackbarShow(snackbarData.cht_to_chs);
        } else if (targetEncoding === 2) {
            currentEncoding = 2;
            targetEncoding = 1;
            saveToLocal.set(targetEncodingCookie, targetEncoding, 2);
            translateBody();
            if (isSnackbar) btf.snackbarShow(snackbarData.chs_to_cht);
        }
    }
    function JTPYStr() {
        return '万与丑专业丛东丝丢两严丧个丬丰临为丽举么义乌乐乔习乡书买乱争于亏云亘亚产亩亲亵亸亿仅从仑仓仪们价众优伙会伛伞伟传伤伥伦伧伪伫体余佣佥侠侣侥侦侧侨侩侪侬俣俦俨俩俪俭债倾偬偻偾偿傥傧储傩儿兑兖党兰关兴兹养兽冁内冈册写军农冢冯冲决况冻净凄凉凌减凑凛几凤凫凭凯击凼凿刍划刘则刚创删别刬刭刽刿剀剂剐剑剥剧劝办务劢动励劲劳势勋勐勚匀匦匮区医华协单卖卢卤卧卫却卺厂厅历厉压厌厍厕厢厣厦厨厩厮县参叆叇双发变叙叠叶号叹叽吁后吓吕吗吣吨听启吴呒呓呕呖呗员呙呛呜咏咔咙咛咝咤咴咸哌响哑哒哓哔哕哗哙哜哝哟唛唝唠唡唢唣唤唿啧啬啭啮啰啴啸喷喽喾嗫呵嗳嘘嘤嘱噜噼嚣嚯团园囱围囵国图圆圣圹场坂坏块坚坛坜坝坞坟坠垄垅垆垒垦垧垩垫垭垯垱垲垴埘埙埚埝埯堑堕塆墙壮声壳壶壸处备复够头夸夹夺奁奂奋奖奥妆妇妈妩妪妫姗姜娄娅娆娇娈娱娲娴婳婴婵婶媪嫒嫔嫱嬷孙学孪宁宝实宠审宪宫宽宾寝对寻导寿将尔尘尧尴尸尽层屃屉届属屡屦屿岁岂岖岗岘岙岚岛岭岳岽岿峃峄峡峣峤峥峦崂崃崄崭嵘嵚嵛嵝嵴巅巩巯币帅师帏帐帘帜带帧帮帱帻帼幂幞干并广庄庆庐庑库应庙庞废庼廪开异弃张弥弪弯弹强归当录彟彦彻径徕御忆忏忧忾怀态怂怃怄怅怆怜总怼怿恋恳恶恸恹恺恻恼恽悦悫悬悭悯惊惧惨惩惫惬惭惮惯愍愠愤愦愿慑慭憷懑懒懔戆戋戏戗战戬户扎扑扦执扩扪扫扬扰抚抛抟抠抡抢护报担拟拢拣拥拦拧拨择挂挚挛挜挝挞挟挠挡挢挣挤挥挦捞损捡换捣据捻掳掴掷掸掺掼揸揽揿搀搁搂搅携摄摅摆摇摈摊撄撑撵撷撸撺擞攒敌敛数斋斓斗斩断无旧时旷旸昙昼昽显晋晒晓晔晕晖暂暧札术朴机杀杂权条来杨杩杰极构枞枢枣枥枧枨枪枫枭柜柠柽栀栅标栈栉栊栋栌栎栏树栖样栾桊桠桡桢档桤桥桦桧桨桩梦梼梾检棂椁椟椠椤椭楼榄榇榈榉槚槛槟槠横樯樱橥橱橹橼檐檩欢欤欧歼殁殇残殒殓殚殡殴毁毂毕毙毡毵氇气氢氩氲汇汉污汤汹沓沟没沣沤沥沦沧沨沩沪沵泞泪泶泷泸泺泻泼泽泾洁洒洼浃浅浆浇浈浉浊测浍济浏浐浑浒浓浔浕涂涌涛涝涞涟涠涡涢涣涤润涧涨涩淀渊渌渍渎渐渑渔渖渗温游湾湿溃溅溆溇滗滚滞滟滠满滢滤滥滦滨滩滪漤潆潇潋潍潜潴澜濑濒灏灭灯灵灾灿炀炉炖炜炝点炼炽烁烂烃烛烟烦烧烨烩烫烬热焕焖焘煅煳熘爱爷牍牦牵牺犊犟状犷犸犹狈狍狝狞独狭狮狯狰狱狲猃猎猕猡猪猫猬献獭玑玙玚玛玮环现玱玺珉珏珐珑珰珲琎琏琐琼瑶瑷璇璎瓒瓮瓯电画畅畲畴疖疗疟疠疡疬疮疯疱疴痈痉痒痖痨痪痫痴瘅瘆瘗瘘瘪瘫瘾瘿癞癣癫癯皑皱皲盏盐监盖盗盘眍眦眬着睁睐睑瞒瞩矫矶矾矿砀码砖砗砚砜砺砻砾础硁硅硕硖硗硙硚确硷碍碛碜碱碹磙礼祎祢祯祷祸禀禄禅离秃秆种积称秽秾稆税稣稳穑穷窃窍窑窜窝窥窦窭竖竞笃笋笔笕笺笼笾筑筚筛筜筝筹签简箓箦箧箨箩箪箫篑篓篮篱簖籁籴类籼粜粝粤粪粮糁糇紧絷纟纠纡红纣纤纥约级纨纩纪纫纬纭纮纯纰纱纲纳纴纵纶纷纸纹纺纻纼纽纾线绀绁绂练组绅细织终绉绊绋绌绍绎经绐绑绒结绔绕绖绗绘给绚绛络绝绞统绠绡绢绣绤绥绦继绨绩绪绫绬续绮绯绰绱绲绳维绵绶绷绸绹绺绻综绽绾绿缀缁缂缃缄缅缆缇缈缉缊缋缌缍缎缏缐缑缒缓缔缕编缗缘缙缚缛缜缝缞缟缠缡缢缣缤缥缦缧缨缩缪缫缬缭缮缯缰缱缲缳缴缵罂网罗罚罢罴羁羟羡翘翙翚耢耧耸耻聂聋职聍联聩聪肃肠肤肷肾肿胀胁胆胜胧胨胪胫胶脉脍脏脐脑脓脔脚脱脶脸腊腌腘腭腻腼腽腾膑臜舆舣舰舱舻艰艳艹艺节芈芗芜芦苁苇苈苋苌苍苎苏苘苹茎茏茑茔茕茧荆荐荙荚荛荜荞荟荠荡荣荤荥荦荧荨荩荪荫荬荭荮药莅莜莱莲莳莴莶获莸莹莺莼萚萝萤营萦萧萨葱蒇蒉蒋蒌蓝蓟蓠蓣蓥蓦蔷蔹蔺蔼蕲蕴薮藁藓虏虑虚虫虬虮虽虾虿蚀蚁蚂蚕蚝蚬蛊蛎蛏蛮蛰蛱蛲蛳蛴蜕蜗蜡蝇蝈蝉蝎蝼蝾螀螨蟏衅衔补衬衮袄袅袆袜袭袯装裆裈裢裣裤裥褛褴襁襕见观觃规觅视觇览觉觊觋觌觍觎觏觐觑觞触觯詟誉誊讠计订讣认讥讦讧讨让讪讫训议讯记讱讲讳讴讵讶讷许讹论讻讼讽设访诀证诂诃评诅识诇诈诉诊诋诌词诎诏诐译诒诓诔试诖诗诘诙诚诛诜话诞诟诠诡询诣诤该详诧诨诩诪诫诬语诮误诰诱诲诳说诵诶请诸诹诺读诼诽课诿谀谁谂调谄谅谆谇谈谊谋谌谍谎谏谐谑谒谓谔谕谖谗谘谙谚谛谜谝谞谟谠谡谢谣谤谥谦谧谨谩谪谫谬谭谮谯谰谱谲谳谴谵谶谷豮贝贞负贠贡财责贤败账货质贩贪贫贬购贮贯贰贱贲贳贴贵贶贷贸费贺贻贼贽贾贿赀赁赂赃资赅赆赇赈赉赊赋赌赍赎赏赐赑赒赓赔赕赖赗赘赙赚赛赜赝赞赟赠赡赢赣赪赵赶趋趱趸跃跄跖跞践跶跷跸跹跻踊踌踪踬踯蹑蹒蹰蹿躏躜躯车轧轨轩轪轫转轭轮软轰轱轲轳轴轵轶轷轸轹轺轻轼载轾轿辀辁辂较辄辅辆辇辈辉辊辋辌辍辎辏辐辑辒输辔辕辖辗辘辙辚辞辩辫边辽达迁过迈运还这进远违连迟迩迳迹适选逊递逦逻遗遥邓邝邬邮邹邺邻郁郄郏郐郑郓郦郧郸酝酦酱酽酾酿释里鉅鉴銮錾钆钇针钉钊钋钌钍钎钏钐钑钒钓钔钕钖钗钘钙钚钛钝钞钟钠钡钢钣钤钥钦钧钨钩钪钫钬钭钮钯钰钱钲钳钴钵钶钷钸钹钺钻钼钽钾钿铀铁铂铃铄铅铆铈铉铊铋铍铎铏铐铑铒铕铗铘铙铚铛铜铝铞铟铠铡铢铣铤铥铦铧铨铪铫铬铭铮铯铰铱铲铳铴铵银铷铸铹铺铻铼铽链铿销锁锂锃锄锅锆锇锈锉锊锋锌锍锎锏锐锑锒锓锔锕锖锗错锚锜锞锟锠锡锢锣锤锥锦锨锩锫锬锭键锯锰锱锲锳锴锵锶锷锸锹锺锻锼锽锾锿镀镁镂镃镆镇镈镉镊镌镍镎镏镐镑镒镕镖镗镙镚镛镜镝镞镟镠镡镢镣镤镥镦镧镨镩镪镫镬镭镮镯镰镱镲镳镴镶长门闩闪闫闬闭问闯闰闱闲闳间闵闶闷闸闹闺闻闼闽闾闿阀阁阂阃阄阅阆阇阈阉阊阋阌阍阎阏阐阑阒阓阔阕阖阗阘阙阚阛队阳阴阵阶际陆陇陈陉陕陧陨险随隐隶隽难雏雠雳雾霁霉霭靓静靥鞑鞒鞯鞴韦韧韨韩韪韫韬韵页顶顷顸项顺须顼顽顾顿颀颁颂颃预颅领颇颈颉颊颋颌颍颎颏颐频颒颓颔颕颖颗题颙颚颛颜额颞颟颠颡颢颣颤颥颦颧风飏飐飑飒飓飔飕飖飗飘飙飚飞飨餍饤饥饦饧饨饩饪饫饬饭饮饯饰饱饲饳饴饵饶饷饸饹饺饻饼饽饾饿馀馁馂馃馄馅馆馇馈馉馊馋馌馍馎馏馐馑馒馓馔馕马驭驮驯驰驱驲驳驴驵驶驷驸驹驺驻驼驽驾驿骀骁骂骃骄骅骆骇骈骉骊骋验骍骎骏骐骑骒骓骔骕骖骗骘骙骚骛骜骝骞骟骠骡骢骣骤骥骦骧髅髋髌鬓魇魉鱼鱽鱾鱿鲀鲁鲂鲄鲅鲆鲇鲈鲉鲊鲋鲌鲍鲎鲏鲐鲑鲒鲓鲔鲕鲖鲗鲘鲙鲚鲛鲜鲝鲞鲟鲠鲡鲢鲣鲤鲥鲦鲧鲨鲩鲪鲫鲬鲭鲮鲯鲰鲱鲲鲳鲴鲵鲶鲷鲸鲹鲺鲻鲼鲽鲾鲿鳀鳁鳂鳃鳄鳅鳆鳇鳈鳉鳊鳋鳌鳍鳎鳏鳐鳑鳒鳓鳔鳕鳖鳗鳘鳙鳛鳜鳝鳞鳟鳠鳡鳢鳣鸟鸠鸡鸢鸣鸤鸥鸦鸧鸨鸩鸪鸫鸬鸭鸮鸯鸰鸱鸲鸳鸴鸵鸶鸷鸸鸹鸺鸻鸼鸽鸾鸿鹀鹁鹂鹃鹄鹅鹆鹇鹈鹉鹊鹋鹌鹍鹎鹏鹐鹑鹒鹓鹔鹕鹖鹗鹘鹚鹛鹜鹝鹞鹟鹠鹡鹢鹣鹤鹥鹦鹧鹨鹩鹪鹫鹬鹭鹯鹰鹱鹲鹳鹴鹾麦麸黄黉黡黩黪黾'
    }
    function FTPYStr() {
        return '萬與醜專業叢東絲丟兩嚴喪個爿豐臨為麗舉麼義烏樂喬習鄉書買亂爭於虧雲亙亞產畝親褻嚲億僅從侖倉儀們價眾優夥會傴傘偉傳傷倀倫傖偽佇體餘傭僉俠侶僥偵側僑儈儕儂俁儔儼倆儷儉債傾傯僂僨償儻儐儲儺兒兌兗黨蘭關興茲養獸囅內岡冊寫軍農塚馮衝決況凍淨淒涼淩減湊凜幾鳳鳧憑凱擊氹鑿芻劃劉則剛創刪別剗剄劊劌剴劑剮劍剝劇勸辦務勱動勵勁勞勢勳猛勩勻匭匱區醫華協單賣盧鹵臥衛卻巹廠廳曆厲壓厭厙廁廂厴廈廚廄廝縣參靉靆雙發變敘疊葉號歎嘰籲後嚇呂嗎唚噸聽啟吳嘸囈嘔嚦唄員咼嗆嗚詠哢嚨嚀噝吒噅鹹呱響啞噠嘵嗶噦嘩噲嚌噥喲嘜嗊嘮啢嗩唕喚呼嘖嗇囀齧囉嘽嘯噴嘍嚳囁嗬噯噓嚶囑嚕劈囂謔團園囪圍圇國圖圓聖壙場阪壞塊堅壇壢壩塢墳墜壟壟壚壘墾坰堊墊埡墶壋塏堖塒塤堝墊垵塹墮壪牆壯聲殼壺壼處備複夠頭誇夾奪奩奐奮獎奧妝婦媽嫵嫗媯姍薑婁婭嬈嬌孌娛媧嫻嫿嬰嬋嬸媼嬡嬪嬙嬤孫學孿寧寶實寵審憲宮寬賓寢對尋導壽將爾塵堯尷屍盡層屭屜屆屬屢屨嶼歲豈嶇崗峴嶴嵐島嶺嶽崠巋嶨嶧峽嶢嶠崢巒嶗崍嶮嶄嶸嶔崳嶁脊巔鞏巰幣帥師幃帳簾幟帶幀幫幬幘幗冪襆幹並廣莊慶廬廡庫應廟龐廢廎廩開異棄張彌弳彎彈強歸當錄彠彥徹徑徠禦憶懺憂愾懷態慫憮慪悵愴憐總懟懌戀懇惡慟懨愷惻惱惲悅愨懸慳憫驚懼慘懲憊愜慚憚慣湣慍憤憒願懾憖怵懣懶懍戇戔戲戧戰戩戶紮撲扡執擴捫掃揚擾撫拋摶摳掄搶護報擔擬攏揀擁攔擰撥擇掛摯攣掗撾撻挾撓擋撟掙擠揮撏撈損撿換搗據撚擄摑擲撣摻摜摣攬撳攙擱摟攪攜攝攄擺搖擯攤攖撐攆擷擼攛擻攢敵斂數齋斕鬥斬斷無舊時曠暘曇晝曨顯晉曬曉曄暈暉暫曖劄術樸機殺雜權條來楊榪傑極構樅樞棗櫪梘棖槍楓梟櫃檸檉梔柵標棧櫛櫳棟櫨櫟欄樹棲樣欒棬椏橈楨檔榿橋樺檜槳樁夢檮棶檢欞槨櫝槧欏橢樓欖櫬櫚櫸檟檻檳櫧橫檣櫻櫫櫥櫓櫞簷檁歡歟歐殲歿殤殘殞殮殫殯毆毀轂畢斃氈毿氌氣氫氬氳彙漢汙湯洶遝溝沒灃漚瀝淪滄渢溈滬濔濘淚澩瀧瀘濼瀉潑澤涇潔灑窪浹淺漿澆湞溮濁測澮濟瀏滻渾滸濃潯濜塗湧濤澇淶漣潿渦溳渙滌潤澗漲澀澱淵淥漬瀆漸澠漁瀋滲溫遊灣濕潰濺漵漊潷滾滯灩灄滿瀅濾濫灤濱灘澦濫瀠瀟瀲濰潛瀦瀾瀨瀕灝滅燈靈災燦煬爐燉煒熗點煉熾爍爛烴燭煙煩燒燁燴燙燼熱煥燜燾煆糊溜愛爺牘犛牽犧犢強狀獷獁猶狽麅獮獰獨狹獅獪猙獄猻獫獵獼玀豬貓蝟獻獺璣璵瑒瑪瑋環現瑲璽瑉玨琺瓏璫琿璡璉瑣瓊瑤璦璿瓔瓚甕甌電畫暢佘疇癤療瘧癘瘍鬁瘡瘋皰屙癰痙癢瘂癆瘓癇癡癉瘮瘞瘺癟癱癮癭癩癬癲臒皚皺皸盞鹽監蓋盜盤瞘眥矓著睜睞瞼瞞矚矯磯礬礦碭碼磚硨硯碸礪礱礫礎硜矽碩硤磽磑礄確鹼礙磧磣堿镟滾禮禕禰禎禱禍稟祿禪離禿稈種積稱穢穠穭稅穌穩穡窮竊竅窯竄窩窺竇窶豎競篤筍筆筧箋籠籩築篳篩簹箏籌簽簡籙簀篋籜籮簞簫簣簍籃籬籪籟糴類秈糶糲粵糞糧糝餱緊縶糸糾紆紅紂纖紇約級紈纊紀紉緯紜紘純紕紗綱納紝縱綸紛紙紋紡紵紖紐紓線紺絏紱練組紳細織終縐絆紼絀紹繹經紿綁絨結絝繞絰絎繪給絢絳絡絕絞統綆綃絹繡綌綏絛繼綈績緒綾緓續綺緋綽緔緄繩維綿綬繃綢綯綹綣綜綻綰綠綴緇緙緗緘緬纜緹緲緝縕繢緦綞緞緶線緱縋緩締縷編緡緣縉縛縟縝縫縗縞纏縭縊縑繽縹縵縲纓縮繆繅纈繚繕繒韁繾繰繯繳纘罌網羅罰罷羆羈羥羨翹翽翬耮耬聳恥聶聾職聹聯聵聰肅腸膚膁腎腫脹脅膽勝朧腖臚脛膠脈膾髒臍腦膿臠腳脫腡臉臘醃膕齶膩靦膃騰臏臢輿艤艦艙艫艱豔艸藝節羋薌蕪蘆蓯葦藶莧萇蒼苧蘇檾蘋莖蘢蔦塋煢繭荊薦薘莢蕘蓽蕎薈薺蕩榮葷滎犖熒蕁藎蓀蔭蕒葒葤藥蒞蓧萊蓮蒔萵薟獲蕕瑩鶯蓴蘀蘿螢營縈蕭薩蔥蕆蕢蔣蔞藍薊蘺蕷鎣驀薔蘞藺藹蘄蘊藪槁蘚虜慮虛蟲虯蟣雖蝦蠆蝕蟻螞蠶蠔蜆蠱蠣蟶蠻蟄蛺蟯螄蠐蛻蝸蠟蠅蟈蟬蠍螻蠑螿蟎蠨釁銜補襯袞襖嫋褘襪襲襏裝襠褌褳襝褲襇褸襤繈襴見觀覎規覓視覘覽覺覬覡覿覥覦覯覲覷觴觸觶讋譽謄訁計訂訃認譏訐訌討讓訕訖訓議訊記訒講諱謳詎訝訥許訛論訩訟諷設訪訣證詁訶評詛識詗詐訴診詆謅詞詘詔詖譯詒誆誄試詿詩詰詼誠誅詵話誕詬詮詭詢詣諍該詳詫諢詡譸誡誣語誚誤誥誘誨誑說誦誒請諸諏諾讀諑誹課諉諛誰諗調諂諒諄誶談誼謀諶諜謊諫諧謔謁謂諤諭諼讒諮諳諺諦謎諞諝謨讜謖謝謠謗諡謙謐謹謾謫譾謬譚譖譙讕譜譎讞譴譫讖穀豶貝貞負貟貢財責賢敗賬貨質販貪貧貶購貯貫貳賤賁貰貼貴貺貸貿費賀貽賊贄賈賄貲賃賂贓資賅贐賕賑賚賒賦賭齎贖賞賜贔賙賡賠賧賴賵贅賻賺賽賾贗讚贇贈贍贏贛赬趙趕趨趲躉躍蹌蹠躒踐躂蹺蹕躚躋踴躊蹤躓躑躡蹣躕躥躪躦軀車軋軌軒軑軔轉軛輪軟轟軲軻轤軸軹軼軤軫轢軺輕軾載輊轎輈輇輅較輒輔輛輦輩輝輥輞輬輟輜輳輻輯轀輸轡轅轄輾轆轍轔辭辯辮邊遼達遷過邁運還這進遠違連遲邇逕跡適選遜遞邐邏遺遙鄧鄺鄔郵鄒鄴鄰鬱郤郟鄶鄭鄆酈鄖鄲醞醱醬釅釃釀釋裏钜鑒鑾鏨釓釔針釘釗釙釕釷釺釧釤鈒釩釣鍆釹鍚釵鈃鈣鈈鈦鈍鈔鍾鈉鋇鋼鈑鈐鑰欽鈞鎢鉤鈧鈁鈥鈄鈕鈀鈺錢鉦鉗鈷缽鈳鉕鈽鈸鉞鑽鉬鉭鉀鈿鈾鐵鉑鈴鑠鉛鉚鈰鉉鉈鉍鈹鐸鉶銬銠鉺銪鋏鋣鐃銍鐺銅鋁銱銦鎧鍘銖銑鋌銩銛鏵銓鉿銚鉻銘錚銫鉸銥鏟銃鐋銨銀銣鑄鐒鋪鋙錸鋱鏈鏗銷鎖鋰鋥鋤鍋鋯鋨鏽銼鋝鋒鋅鋶鐦鐧銳銻鋃鋟鋦錒錆鍺錯錨錡錁錕錩錫錮鑼錘錐錦鍁錈錇錟錠鍵鋸錳錙鍥鍈鍇鏘鍶鍔鍤鍬鍾鍛鎪鍠鍰鎄鍍鎂鏤鎡鏌鎮鎛鎘鑷鐫鎳鎿鎦鎬鎊鎰鎔鏢鏜鏍鏰鏞鏡鏑鏃鏇鏐鐔钁鐐鏷鑥鐓鑭鐠鑹鏹鐙鑊鐳鐶鐲鐮鐿鑔鑣鑞鑲長門閂閃閆閈閉問闖閏闈閑閎間閔閌悶閘鬧閨聞闥閩閭闓閥閣閡閫鬮閱閬闍閾閹閶鬩閿閽閻閼闡闌闃闠闊闋闔闐闒闕闞闤隊陽陰陣階際陸隴陳陘陝隉隕險隨隱隸雋難雛讎靂霧霽黴靄靚靜靨韃鞽韉韝韋韌韍韓韙韞韜韻頁頂頃頇項順須頊頑顧頓頎頒頌頏預顱領頗頸頡頰頲頜潁熲頦頤頻頮頹頷頴穎顆題顒顎顓顏額顳顢顛顙顥纇顫顬顰顴風颺颭颮颯颶颸颼颻飀飄飆飆飛饗饜飣饑飥餳飩餼飪飫飭飯飲餞飾飽飼飿飴餌饒餉餄餎餃餏餅餑餖餓餘餒餕餜餛餡館餷饋餶餿饞饁饃餺餾饈饉饅饊饌饢馬馭馱馴馳驅馹駁驢駔駛駟駙駒騶駐駝駑駕驛駘驍罵駰驕驊駱駭駢驫驪騁驗騂駸駿騏騎騍騅騌驌驂騙騭騤騷騖驁騮騫騸驃騾驄驏驟驥驦驤髏髖髕鬢魘魎魚魛魢魷魨魯魴魺鮁鮃鯰鱸鮋鮓鮒鮊鮑鱟鮍鮐鮭鮚鮳鮪鮞鮦鰂鮜鱠鱭鮫鮮鮺鯗鱘鯁鱺鰱鰹鯉鰣鰷鯀鯊鯇鮶鯽鯒鯖鯪鯕鯫鯡鯤鯧鯝鯢鯰鯛鯨鯵鯴鯔鱝鰈鰏鱨鯷鰮鰃鰓鱷鰍鰒鰉鰁鱂鯿鰠鼇鰭鰨鰥鰩鰟鰜鰳鰾鱈鱉鰻鰵鱅鰼鱖鱔鱗鱒鱯鱤鱧鱣鳥鳩雞鳶鳴鳲鷗鴉鶬鴇鴆鴣鶇鸕鴨鴞鴦鴒鴟鴝鴛鴬鴕鷥鷙鴯鴰鵂鴴鵃鴿鸞鴻鵐鵓鸝鵑鵠鵝鵒鷳鵜鵡鵲鶓鵪鶤鵯鵬鵮鶉鶊鵷鷫鶘鶡鶚鶻鶿鶥鶩鷊鷂鶲鶹鶺鷁鶼鶴鷖鸚鷓鷚鷯鷦鷲鷸鷺鸇鷹鸌鸏鸛鸘鹺麥麩黃黌黶黷黲黽'
    }
    function Traditionalized(cc) {
        let str = '';
        const ss = JTPYStr();
        const tt = FTPYStr();
        for (let i = 0; i < cc.length; i++) {
            if (cc.charCodeAt(i) > 10000 && ss.indexOf(cc.charAt(i)) !== -1) { str += tt.charAt(ss.indexOf(cc.charAt(i))) } else str += cc.charAt(i)
        };
        return str;
    }
    function Simplized(cc) {
        let str = '';
        const ss = JTPYStr();
        const tt = FTPYStr();
        for (let i = 0; i < cc.length; i++) {
            if (cc.charCodeAt(i) > 10000 && tt.indexOf(cc.charAt(i)) !== -1) { str += ss.charAt(tt.indexOf(cc.charAt(i))) } else str += cc.charAt(i)
        }
        return str;
    }
    function translateInitialization() {
        translateButtonObject = document.getElementById('menu-translate');
        if (translateButtonObject) {
            if (currentEncoding !== targetEncoding) {
                setTimeout(translateBody, translateDelay);
            }
            translateButtonObject.addEventListener('click', translatePage, false);
        }
    }
    $('#menu-backward').on('click', function () { window.history.back(); });
    $('#menu-forward').on('click', function () { window.history.forward(); });
    $('#menu-refresh').on('click', function () { window.location.reload(); });
    $('#menu-darkmode').on('click', function () { switchDarkMode() });
    $('#menu-home').on('click', function () { window.location.href = window.location.origin; });

    /**
     * 简体繁体切换
     */
    $('#menu-translate').on('click', function () {
        //关闭右键菜单
        removeRightMenu();
        translateInitialization();
    });
    $(".menu-link").on("click", function () {
        removeRightMenu()
    });
    $("#rightmenu-mask").on("click", function () { removeRightMenu() });
    $("#rightmenu-mask").contextmenu(function () {
        removeRightMenu();
        return false;
    });

    /**
     * 打印
     */
    $("#menu-print").on("click", function () {
        removeRightMenu();
        window.print();
    });

    /**
     * 复制选中文字
     */
    $("#menu-copy").on("click", function () {
        removeRightMenu();
        document.execCommand('Copy', false, null);
        // 通知提示框，需要引入Snackbar，具体操作参考api
        Snackbar.show({
            pos: 'top-left', 
            backgroundColor: '#F2F9EC',
            text: '您偷偷复制了一下~',  
            textColor: '#7EC050',
            showAction: true,
            actionText: '被博主发现了!',
            actionTextColor: '#FFB7C5',
            duration: 2000
        });
    });

    /**
     * 回到顶部
     */
    $("#menu-scrollToTop").on("click", function () {
        removeRightMenu();
        btf.scrollToDest(0, 500);
    });

    /**
     * 全屏幕
     */
    $("#menu-screen").on("click", function () {
        removeRightMenu();
        if(document.fullscreenElement) {
    		document.exitFullscreen()
            // 通知提示框，需要引入Snackbar，具体操作参考api
            Snackbar.show({
                pos: 'top-left', 
                backgroundColor: '#FCF0F0',
                text: '已退出全屏模式',  
                textColor: '#E47470',
                showAction: true,
                actionText: '悄悄离开!',
                actionTextColor: '#FFB7C5',
                duration: 2000
            });
    	} else {
    		document.documentElement.requestFullscreen()
            // 通知提示框，需要引入Snackbar，具体操作参考api
            Snackbar.show({
                pos: 'top-left', 
                backgroundColor: '#F2F9EC',
                text: '已进入全屏模式',  
                textColor: '#7EC050',
                showAction: true,
                actionText: '被博主发现了!',
                actionTextColor: '#FFB7C5',
                duration: 2000
            });
    	}
    });

    /**
     * 阅读模式
     */
    $("#menu-readmode").on("click", function () {
        removeRightMenu();
        //阅读模式
        const $body = document.body
        $body.classList.add('read-mode')
        //阅读模式右上角退出按钮
        const newEle = document.createElement('button')
        newEle.type = 'button'
        newEle.className = 'fas fa-sign-out-alt exit-readmode'
        $body.appendChild(newEle)
        function clickFn () {
            $body.classList.remove('read-mode')
            newEle.remove()
            newEle.removeEventListener('click', clickFn)
        }
        newEle.addEventListener('click', clickFn)
        // 通知提示框，需要引入Snackbar，具体操作参考api
        Snackbar.show({
            pos: 'top-left', 
            backgroundColor: '#F2F9EC',
            text: '已进入阅读模式',  
            textColor: '#7EC050',
            showAction: false,
            actionText: '被博主发现了!',
            actionTextColor: '#FFB7C5',
            duration: 2000
        });
    });
  4. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/css文件夹下新建一个rightMenu.css，将以下代码复制到文件中。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    #rightMenu {
        display: none;
        position: fixed;
        padding: 0 .25rem;
        width: 9rem;
        height: fit-content;
        top: 10%;
        left: 10%;
        background-color: rgba(238, 255, 255, .85);
        -webkit-backdrop-filter: blur(20px);
        backdrop-filter: blur(20px);
        color: #363636;
        border-radius: 12px;
        z-index: 99994;
        border: #e3e8f7;
        user-select: none;
        box-shadow: rgba(0, 0, 0, .05);
    }
    #rightMenu a {
        color: #363636;
    }
    #rightMenu .rightMenu-group {
        padding: .35rem .3rem;
        transition: .3s
    }
    #rightMenu .rightMenu-line {
        border-top: 1px dashed #4259ef23
    }
    #rightMenu .rightMenu-group.rightMenu-small {
        display: flex;
        justify-content: space-between
    }
    #rightMenu .rightMenu-group .rightMenu-item {
        border-radius: 8px;
        transition: .3s;
        cursor: pointer
    }
    #rightMenu .rightMenu-line .rightMenu-item {
        margin: .25rem 0;
        padding: .25rem 0
    }
    #rightMenu .rightMenu-group.rightMenu-line .rightMenu-item {
        display: flex
    }
    #rightMenu .rightMenu-group .rightMenu-item:hover {
        background-color: #6f42c1;
        color: #fff;
    }
    #rightMenu .rightMenu-group .rightMenu-item:active {
        transform: scale(.97)
    }
    #rightMenu .rightMenu-group .rightMenu-item i {
        display: inline-block;
        text-align: center;
        line-height: 1.5rem;
        width: 1.5rem;
        padding: 0 .25rem
    }
    #rightMenu .rightMenu-line .rightMenu-item i {
        margin: 0 .25rem
    }
    #rightMenu .rightMenu-group .rightMenu-item span {
        line-height: 1.5rem
    }
    .rightMenu-small .rightMenu-item {
        width: 30px;
        height: 30px;
        line-height: 30px
    }
    #rightmenu-mask {
        position: fixed;
        width: 100vw;
        height: 100vh;
        background: 0 0;
        top: 0;
        left: 0;
        display: none;
        z-index: 101;
        margin: 0 !important;
        z-index: 99993
    }
  5. 在主题配置文件_config.butterfly.yml中引入Jquery、rightMenu.js和rightMenu.css。
    1
    2
    3
    4
    5
    6
    inject:
      head:
        - <link rel="stylesheet" href="/css/rightMenu.css">
      bottom:
        - <script defer src="https://npm.elemecdn.com/jquery@latest/dist/jquery.min.js"></script>
        - <script defer data-pjax src="/js/rightMenu.js"></script>
  6. 最后重新编译运行,即可看见效果。

    需要注意的是，如果点击繁简切换，切换模式，出现了错误，请检查下主题的这两个功能是否开启。
    在主题配置文件_config.butterfly.yml中搜索translate和darkmode，将enable设置为true，在重新编译运行。

    注意：通知提示框，需要引入Snackbar组件，具体操作参考下面的API

右键菜单-打印功能

  1. 增加DOM，在hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/right-menu/index.pug中新加如下代码：
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    #rightMenu
        .rightMenu-group.rightMenu-small
            .rightMenu-item#menu-backward
                i.fa-solid.fa-arrow-left
            .rightMenu-item#menu-forward
                i.fa-solid.fa-arrow-right
            .rightMenu-item#menu-refresh
                i.fa-solid.fa-arrow-rotate-right
            .rightMenu-item#menu-home
                i.fa-solid.fa-house
        .rightMenu-group.rightMenu-line.rightMenuOther
            a.rightMenu-item.menu-link(href='/archives/')
                i.fa-solid.fa-archive
                span='文章归档'
            a.rightMenu-item.menu-link(href='/categories/')
                i.fa-solid.fa-folder-open
                span='文章分类'
            a.rightMenu-item.menu-link(href='/tags/')
                i.fa-solid.fa-tags
                span='文章标签'
        .rightMenu-group.rightMenu-line.rightMenuNormal
            //- a.rightMenu-item.menu-link#menu-radompage(href='/archives')
            a.rightMenu-item.menu-link#menu-randomPost
                i.fa-solid.fa-shoe-prints
                span='随便逛逛'
            .rightMenu-item#menu-translate
                i.fa-solid.fa-earth-asia
                span='繁简切换'
            .rightMenu-item#menu-darkmode
                i.fa-solid.fa-moon
                span='切换模式'
            .rightMenu-item#menu-print
                i.fa-solid.fa-print.fa-fw
                span='打印页面'
    #rightmenu-mask
  2. 在hexo-blog-demo/node_modules/hexo-theme-butterfly/source/js/rightMenu.js中写入实现方法。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    $('#menu-translate').on('click', function () {
        removeRightMenu();
        translateInitialization();
    });
    $(".menu-link").on("click", function () {
        removeRightMenu()
    });
    +   $("#menu-print").on("click", function () {
    +       removeRightMenu();
    +       window.print();
    +   });
    $("#rightmenu-mask").on("click", function () { removeRightMenu() });
    $("#rightmenu-mask").contextmenu(function () {
        removeRightMenu();
        return false;
    });
  3. 最后重新编译运行，即可看见效果。

右键菜单-其他功魔改功能

https://yisous.xyz/posts/11eb4aac/

禁止右键及F12等事件

  1. 在主题配置文件_config.butterfly.yml添加配置
    1
    2
    3
    # 页面控制台F12
    page_console:
      enable: false # 启用true 禁用false
  2. 修改【hexo-blog-demo/node_modules/hexo-theme-butterfly/layout/includes/layout.pug】，根据图中位置添加以下 pug 代码（跟 head、body同级）。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    //- 禁止F12控制台 START
    if theme.page_console.enable == false
        script.
            ((function() {var callbacks = [],timeLimit = 50,open = false;setInterval(loop, 1);return {addListener: function(fn) {callbacks.push(fn);},cancleListenr: function(fn) {callbacks = callbacks.filter(function(v) {return v !== fn;});}}
            function loop() {var startTime = new Date();debugger;if (new Date() - startTime > timeLimit) {if (!open) {callbacks.forEach(function(fn) {fn.call(null);});}open = true;window.stop();alert('非常抱歉，希望您最好不要这样！');document.body.innerHTML = "";} else {open = false;}}})()).addListener(function() {window.location.reload();});
        script.
            function toDevtools(){
            let num = 0; 
            let devtools = new Date();
            devtools.toString = function() {
                num++;
                if (num > 1) {
                    alert('非常抱歉，希望您最好不要这样！')
                    window.location.href = "about:blank"
                    blast();
                }
            }
            console.log('', devtools);
            }
            toDevtools();
      //- 禁止F12控制台 END
  3. 将以下代码复制到自定义的custom.js
    1
    2
    3
    document.onkeydown = function (e) {
        if (123 == e.keyCode || (e.ctrlKey && e.shiftKey && (74 === e.keyCode || 73 === e.keyCode || 67 === e.keyCode)) || (e.ctrlKey && 85 === e.keyCode)) return btf.snackbarShow("你真坏，不能打开控制台喔!"), event.keyCode = 0, event.returnValue = !1, !1
    };
  4. 重新编译运行，即可看到效果。
  5. 注意: 如果自己调试阶段，按照下面步骤进行。但部署时放开注释，编译好再丢上去就OK了。
    • 第一步设置为true，
    • 可注释第三步中custom.js的代码注释掉
    • 编译即可

通知提示框【Snackbar】

当进行某些操作时，需要使用到通知提示框，当前博客引入的是【Snackbar组件官网】【Github Snackbar组件】。

引入Snackbar组件

引用方式1：安装Snackbar依赖

在项目根目录下，下载Snackbar的npm依赖包

1
npm install node-snackbar

引用方式2：下载静态资源

网上下载Snackbar的静态资源，点击下载
在/public中新建个文件夹node-snackbar，把dist丢进去。
这种方式需要在主题配置文件_config.butterfly.yml引入静态资源路径。

1
2
3
4
5
6
7
inject:
  head:
    # snackbar通知框样式css
    - <link rel="stylesheet" type="text/css" href="/snackbar/dist/snackbar.min.css" />
  bottom:
    # snackbar通知框样式js
    - <script type="text/javascript" src="/snackbar/dist/snackbar.min.js"></script>

Snackbar调用函数

JavaScript中的操作语法，由于Snackbar有默认值，可以删除函数中用不到的参数。

1
2
3
4
5
6
7
8
9
10
Snackbar.show({
    pos: 'top-left', 
    backgroundColor: '#000000',
    text: '欢迎欢迎',  
    textColor: '#FFFFFF',
    showAction: false,
    actionText: '成功',
    actionTextColor: '#FFFFFF',
    duration: 5000
});

参数描述

参数 默认值 描述
text null 通知中显示的文本
textColor #FFFFFF 通知文本的文本颜色。 默认为白色
pos bottom-left 通知将显示的位置。有关可能的位置，请参阅上面的示例。bottom-left、bottom-center、bottom-right、top-left、top-center、top-right
customClass null 将自定义类添加到自定义样式的通知中
width auto 通知的宽度。用于 根据需要缩小/展开窗口
showAction true 布尔值显示或不显示操作按钮
actionText Dismiss 显示为操作按钮的文本
actionTextAria Dismiss, Description for Screen Readers 屏幕阅读器的文本
alertScreenReader false 确定屏幕阅读器是否会通知快餐栏消息
actionTextColor #4CAF50 操作按钮的文本颜色
backgroundColor #323232 通知窗口的背景颜色
duration 5000 在淡出之前显示通知的时间（以毫秒为单位）
onActionClick function(ele) 默认操作关闭通知
onClose function(ele) 当通知关闭时触发

完善底层

如果觉得样式或动作不满意，
使用【引用方式1】，可以进入/smart-blog/smart-blog-web/node_modules/node-snackbar，对Snackbar进一步修改。
使用【引用方式2】，可以进入/smart-blog/smart-blog-web//public/node-snackbar/dist/snackbar.min.css，对Snackbar进一步修改。

案例

设置首页欢迎通知窗
博主为了图省事，使用【引入方式1】，并且直接将下面的代码，叠进到之前的自定义样式文件custom.css和custom.js内
/smart-blog-web/node_modules/hexo-theme-butterfly/source/css/custom.css
/smart-blog-web/node_modules/hexo-theme-butterfly/source/js/custom.js

1
2
3
4
5
6
7
8
9
10
11
12
// 首页欢迎通知框 STRAT
if(window.location.href == 'http://localhost:4000/' ||window.location.href == 'http://blog.renyuxin.cn/' ||window.location.href == 'https://blog.renyuxin.cn/'){
    Snackbar.show({ 
        actionText: '关闭',
        text: '欢迎来到丨学弟不想努力了丨的小站！',
        backgroundColor: '#9c9',
        actionTextColor: '#ffffff',
        pos: 'bottom-center',
        duration: '300000' 
    });
}
// 首页欢迎通知框 END
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
/* 首页欢迎通知框 START */
/* 颜色设置 */
[data-theme=light] {
    --sianx_popup: #494949;/* 白天 */
  }
  [data-theme=dark] {
    --sianx_popup: #BDBDBD;/* 夜间 */
  }
  .snackbar-pos {
    border-radius: 45px !important;/* 弹窗圆角 */
  }
  .snackbar-container {
    background: var(--sianx_popup) !important;/* 弹窗颜色 */
  }
  /* 字体设置，没有自定义字体的可忽略，这边只是提醒一下 */
  .snackbar-container {
    /* snackbar弹窗 */
    font-family: 'aqqxs', sans-serif !important;
  }
  .bottom-center button{
    font-weight: 600 !important;
  }
  .bottom-center p{
    font-weight: 600 !important;
  }
/* 首页欢迎通知框 END */

实时FPS

在 hexo 博客根目录新建 source/static/fps/fps.js 和 source/custaticstom/fps/fps.css

fps.js文件如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
if (window.localStorage.getItem("fpson") == undefined || window.localStorage.getItem("fpson") == "1") {
    var rAF = function () {
        return (
            window.requestAnimationFrame ||
            window.webkitRequestAnimationFrame ||
            function (callback) {
                window.setTimeout(callback, 1000 / 60);
            }
        );
    }();
    var frame = 0;
    var allFrameCount = 0;
    var lastTime = Date.now();
    var lastFameTime = Date.now();
    var loop = function () {
        var now = Date.now();
        var fs = (now - lastFameTime);
        var fps = Math.round(1000 / fs);
        lastFameTime = now;
        // 不置 0，在动画的开头及结尾记录此值的差值算出 FPS
        allFrameCount++;
        frame++;
        if (now > 1000 + lastTime) {
            var fps = Math.round((frame * 1000) / (now - lastTime));
            if (fps <= 5) {
                var kd = `<span style="color:#bd0000">卡成ppt🤢</span>`
            } else if (fps <= 15) {
                var kd = `<span style="color:red">电竞级帧率😖</span>`
            } else if (fps <= 25) {
                var kd = `<span style="color:orange">有点难受😨</span>`
            } else if (fps < 35) {
                var kd = `<span style="color:#9338e6">不太流畅🙄</span>`
            } else if (fps <= 45) {
                var kd = `<span style="color:#08b7e4">还不错哦😁</span>`
            } else {
                var kd = `<span style="color:#39c5bb">十分流畅🤣</span>`
            }
            // document.getElementById("fps").innerHTML = `FPS:${fps} ${kd}`;
            document.getElementById("fps").innerHTML = `FPS:${fps}`;
            frame = 0;
            lastTime = now;
        };

        rAF(loop);
    }
    loop();
} else {
    document.getElementById("fps").style = "display:none!important"
}

fps.css文件如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/* 帧率检测 */
#fps {
    position: fixed;
    /* 指定位置 */
    right: 10px;
    bottom: 5px;
    /* z-index: 1919810; */
  }
  [data-theme="light"] #fps {
    /* background-color: rgba(255, 255, 255, 0.85); */
    backdrop-filter: var(--backdrop-filter);
    padding: 4px;
    border-radius: 5px;
    height: 35px;
  }
  [data-theme="dark"] #fps {
    /* background-color: rgba(0, 0, 0, 0.72); */
    backdrop-filter: var(--backdrop-filter);
    padding: 4px;
    border-radius: 5px;
    height: 35px;
  }

在主题配置文件_config.butterfly.yml添加配置
1
2
3
4
5
6
7
inject:
  head:
  bottom:
    # FPS显示
    - <span id="fps"></span> 
    - <link rel="stylesheet" href="/static/fps/fps.css" media="defer" onload="this.media='all'">
    - <script src="/static/fps/fps.js"></script>

评论
avatar
学弟不想努力了
不拼，谁都不会知道输的是谁
文章
169
标签
72
分类
63
关注我
标签
JavaRedisAPPIDEMacLinux防火墙科学上网EMO数独闲谈JDKAPI装机AIGPT书籍平面设计HexoHugoPM2消息队列nodejsHtmlJavaScriptPythonGoNacosJenkinsDockerNginxTomcatElasticsearchSQLMySQLMongodbMaven硬件外设主机配件Vue网络群晖NAS破解教程PycharmRequestsScrapySplashSSL历史摄影ExceptionSpring BootJsonGsonHttpClientRocketMQRabbitMQEclipseKafka若依Excel极光推送ZookeeperJsp正则SocketJsoup腾讯云Wechat短信服务聚合数据阿里云
分类
最新评论
正在加载中...
网站资讯
文章数目 :
169
已运行时间 :
本站总字数 :
205.6k
本站访客数 :
本站总访问量 :
最后更新时间 :
访客地图
文章分类文章标签
随便逛逛阅读模式
全屏模式