把嘉然live2D添加到博客网站当看板娘

参考：搬运的博客   原博客

首先在app/views/application.html.erb文件底部增加这样一段内容。

 <footer>
       <script src="https://cdn.jsdelivr.net/npm/greensock@1.20.2/dist/TweenLite.js"></script>
       <script src="https://cubism.live2d.com/sdk-web/cubismcore/live2dcubismcore.min.js"></script>
       <script src="https://cdn.jsdelivr.net/npm/pixi.js@5.3.6/dist/pixi.min.js"></script>
       <script src="https://cdn.jsdelivr.net/npm/pixi-live2d-display@0.3.1/dist/cubism4.min.js"></script>
       <link href="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio.css" rel="stylesheet" type="text/css"/>
       <script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio.js"></script>
       <script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/pio_sdk4.js"></script>
       <script src="https://cdn.jsdelivr.net/gh/journey-ad/blog-img@76ba2b3/live2d/lib/load.js"></script>
     </footer>
  </body>

并且在底部增加css， 不然会显示三分之一的页面。
<style>
#pio {
 touch-action: none;
 cursor: inherit;
 height: 240px;
 vertical-align: middle;
}
</style>

是的就可以了，因为是香港服务器，使用这些源是可以的。

就会跟着你的鼠标进行动态变化。

点击菜单还可以进行更换人物等