AI+数字化开发
主页
文章
开源
关于我
微信号:卓大
毕业于:山东大学 SDU.CS
地点:洛阳、郑州、其他
近期:专注AI+中医/供应链/教育
技能:CTO / 全栈工程师
领域:教育,供应链,中医大健康;
给你的博客添加一个“萌娘”、“萝莉”
发表于 2020-03-09 22:36:47
|
分类于
前端
前端
|
blog
美化
live2d
前言:
给你的博客添加一个“萌娘”、“萝莉”,使你的博客更加形象生动
### 技术 其实并不是特别复杂的技术,是使用L2D网页动画人物来实现的,核心是L2Dwidget.js的功能,感兴趣的同学可以研究下 “L2Dwidget.js”。 ### 使用 在你的html代码中添加如下代码 ```javascript ``` 具体效果可以查看本博客 ### 其他人物 提供了其他几个人物2d模型供大家选择: 黑猫:https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json 萌娘:https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json 白猫:https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json 狗狗:https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json 小可爱:https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json 小可爱:https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json 只需替换 上面代码中的 jsonPath 变量即可 ### 修改样式 如果想修改萝莉的css样式,页面具体HTML元素ID是 live2dcanvas,如下图,点击图片放大。根据这个元素ID可以自定义重写CSS样式。