簡單幾步為博客園添加動態動漫妹子


簡單幾步為博客園添加動態動漫妹子

 

一、效果圖

相信從事技術開發的朋友們,都有自己的博客。

今天我們來講講如何讓自己的博客增加一點色彩。

我們來看一張效果圖:

 

 

 

右下角有個很乖巧的動漫妹子,鼠標移動,妹子會搖頭晃腦~

集成其實很簡單,這是一種2D技術,實現方式有挺多中的,業界有比較多的方案,今天我們講講L2Dwidget。

博客園加入這個集成的效果其實很簡單的,下面我們講講如何在博客里面引入這動漫妹子模型:

二、添加插件

我們在【設置】頁面下方找到【博客側邊欄公告(支持HTML代碼) (支持 JS 代碼)】這項,然后加入以下代碼:

復制代碼
<script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.0.min.js"></script>
<script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.min.js"></script>

<script type="text/javascript">
  "model": { 
    jsonPath: "https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json",//這是插件模型,可以任意選擇想要添加的2d動畫
    "scale": 1
  },
    L2Dwidget.init({
      "display": {
        "superSample": 2,
        "width": 200,//寬度
        "height": 400,//高度
        "position": "right",//位置,right,left
        "hOffset": 0,
        "vOffset": 0
      }
   });
</script>
復制代碼

這樣我們就看到這個漫畫妹子模型了。

三、更換人物

除了這個妹子以外,還有其他的模型,22款隨君采。那么如何使用其他模型呢?具體操作如下:

在以上代碼中的“model”中的“jsonPath”中的鏈接中,將紅字部分替換為以下模型中任意一個紅字部分即可。

22款模型名稱:

復制代碼
live2d-widget-model- chitose
live2d-widget-model- epsilon2_1
live2d-widget-model- gf
live2d-widget-model- haru/01 (use npm install --save live2d-widget-model-haru)
live2d-widget-model- haru/02 (use npm install --save live2d-widget-model-haru)
live2d-widget-model- haruto
live2d-widget-model- hibiki
live2d-widget-model- hijiki
live2d-widget-model- izumi
live2d-widget-model- koharu
live2d-widget-model- miku
live2d-widget-model- ni-j
live2d-widget-model- nico
live2d-widget-model- nietzsche
live2d-widget-model- nipsilon
live2d-widget-model- nito
live2d-widget-model- shizuku
live2d-widget-model- tororo
live2d-widget-model- tsumiki
live2d-widget-model- unitychan
live2d-widget-model- wanko
live2d-widget-model- z16
復制代碼

22款模型效果圖地址如下:

https://huaji8.top/post/live2d-plugin-2.0/

好了,以上就是往博客園中加入動態動漫人物的介紹了,喜歡的話支持以下哦~

 

原文鏈接:https://www.cnblogs.com/cczlovexw/p/12214618.html

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM