为博客添加动态弹簧人物效果

今天就来说一下博客怎么添加GitHub上sakana大佬的开源项目


添加弹簧人物的步骤
找到主题编辑器，在 footer.php 添加如下代码即可

<div class="sakana-box"></div>
    <script src="https://cdn.jsdelivr.net/npm/sakana"></script>
    <script>
        // 启动
        const sakana = Sakana.init({
          el:         '.sakana-box',     // 启动元素 node 或 选择器
          scale:      .5,                // 缩放倍数
          canSwitchCharacter: true,      // 允许换角色
          inertia:    0.01,              // 惯性
          decay:      0.97,              // 衰减
          r:          -20,                // 启动角度
          y:          10,                // 启动高度
          scale:      0.5,                 // 缩放倍数
          translateY: 0,                 // 位移高度
        });
    </script>
     
    <style>
        html .sakana-box{
            z-index: 80;
            position: fixed;
            right: 0;
            bottom: 0;
            transform-origin: 100% 100%; /* 从右下开始变换 */
        }
    </style>

如果弹簧人物加载缓慢，可以将 js 文件下载到本地