網頁新增L2Dwidget.js看板娘
阿新 • • 發佈：2021-01-01
話不多說，直接上乾貨~
其實就是在html檔案中的head標籤中新增如下js程式碼即可
<!-- L2Dwidget.js L2D網頁動畫人物 --> <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/[email protected]/assets/shizuku.model.json", "scale": 1, "hHeadPos":0.5, "vHeadPos":0.618 }, "display": { "position": "right", "width": 100, "height": 200, "hOffset": 0, "vOffset": 0 }, "mobile": { "show": true, "scale": 0.5 }, "react": { "opacityDefault": 0.7, "opacityOnHover": 0.2 } }); </script>
檢視效國
更換src的連結，更換不同的模型：
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
其他可選的模型： 小帥哥： https://unpkg.com/[email protected]/assets/chitose.model.json 萌娘：https://unpkg.com/[email protected]/assets/shizuku.model.json 小可愛（女）：https://unpkg.com/[email protected]/assets/koharu.model.json 小可愛（男）：https://unpkg.com/[email protected]/assets/haruto.model.json 初音：https://unpkg.com/[email protected]/assets/miku.model.json