web前端 live2dw小人物显示
2020年11月25日web前端 live2dw小人物显示
小人预览效果
图片: 
小人的目光会跟着鼠标移动~~更多功能自己去挖掘吧 哈哈哈
如何显示小人
废话不多说、上源码、
首先肯定是导入小人物的资源了
导入的话只要导入一个js文件
|
1 2 3 |
<span class="token comment"><!-- 导入js资源 注意路径不要写错 --></span> <script src="live2dw/lib/L2Dwidget.min.js"></script> |
|
1 |
<span class="token comment">//初始化小人物 需设置属性pluginRootPath: "live2dw/"指明资源跟路径</span> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
L2Dwidget.init({ pluginRootPath: "live2dw/",//资源root路径 pluginJsPath: "lib/",//js相对root的路径 pluginModelPath: "assets/",//模型相对root的路径 tagMode: !1, debug: !1, model: { scale: 2, jsonPath: "live2dw/assets/asuna_33.model.json" }, display: {//大小位置什么的自己慢慢调就是了 position: "left",//定位 width: 130,//宽度 height: 210,//高度 hOffset: -40,//左右 vOffset: 0//上下 }, mobile: { show: !1 }, log: !1 }); |
完成上述代码，如果不出现路径错误就可以在页面看到小人了~第一次写博客，还有点小激动哈哈哈
