L2Dwidget.js L2D网页动画人物添加
hexo 添加live2d看板动画
https://www.jianshu.com/p/3a6342e16e57
首先贴出官网代码
官网地址配置:https://www.npmjs.com/package/hexo-helper-live2d
按如下步骤执行
1️⃣ 首先检查博客主目录下面的 package.json
里是否有
"hexo-helper-live2d": "^3.0.3",
依赖,有的话可以先卸载
使用命令:npm uninstall hexo-helper-live2d
之后再安装:npm install --save hexo-helper-live2d
注意:命令都是在你的博客主目录执行

安装完成之后在package.json
会看到安装的model

此时再去 node_moduels
目录下,可以看到有如下文件夹,这些都是动画主配置

2️⃣下载各种动画model:
地址:https://github.com/xiazeyu/live2d-widget-models.git
3️⃣下载好之后将packages里的所有动画模板拷贝到博客的node_modules目录里

4️⃣配置博客站点配置文件,_config.yml
live2d:
enable: true
pluginModelPath: assets/
model:
use: live2d-widget-model-epsilon2_1 #模板目录,在node_modules里
display:
position: right
width: 150
height: 300
mobile:
show: false #是否在手机进行显示
5️⃣开始部署
当使用hexo clean
或者 hexo g
命令的时候,这时候就可以看到如下日志了

INFO HEXO-HELPER-LIVE2D: Loaded model from npm-module(1), live2d-widget-model-epsilon2_1@1.0.5 from 'D:\github\blog\node_modules\live2d-widget-model-epsilon2_1\assets'
说明已经加载到了配置的动画模板,到此就完成了。
L2Dwidget.js L2D网页动画人物添加的更多相关文章
- 为自己的网页博客添加L2Dwidget.js看板娘
如果是博客园,直接在设置-->页脚 HTML 代码,加上下面代码: 1 <!-- L2Dwidget.js L2D网页动画人物 --> 2 <script src=" ...
- 如何查看一个网页特定效果的js代码(动画效果可js和css)(页面可以看到js的源代码)
如何查看一个网页特定效果的js代码(动画效果可js和css)(页面可以看到js的源代码) 一.总结 1.动画效果可能是 CSS 实现的,也可能是 JS 实现的. 2.直接Chrome的F12调试即可, ...
- html+css+js实现网页拼图游戏
代码地址如下:http://www.demodashi.com/demo/14449.html 项目描述 使用 html+js+css 实现一个网页拼图游戏,可支持简单,中等,困难三种难度. 演示效果 ...
- html5网页动画总结--jQuery旋转插件jqueryrotate
CSS3 提供了多种变形效果,比如矩阵变形.位移.缩放.旋转和倾斜等等,让页面更加生动活泼有趣,不再一动不动.然后 IE10 以下版本的浏览器不支持 CSS3 变形,虽然 IE 有私有属性滤镜(fil ...
- 如何使用js捕获css3动画
如何使用js捕获css3动画 css3动画功能强大,但是不像js,没有逐帧控制,但是可以通过js事件来确定任何动画的状态. 下面是一段css3动画代码: #anim.enable{ -webkit-a ...
- CSS3网页动画
CSS3网页动画 概要:CSS3变形是一些效果的集合 如:平移.旋转.缩放.倾斜效果 每个效果都可以称为变形(transform)他们可以分别操控元素发生平移.旋转.缩放.倾斜等变化. 网页中能够实现 ...
- 第三百五十节,Python分布式爬虫打造搜索引擎Scrapy精讲—selenium模块是一个python操作浏览器软件的一个模块,可以实现js动态网页请求
第三百五十节,Python分布式爬虫打造搜索引擎Scrapy精讲—selenium模块是一个python操作浏览器软件的一个模块,可以实现js动态网页请求 selenium模块 selenium模块为 ...
- 基于jquery和svg超炫的网页动画
今天给大家分享一款基于jquery和svg超炫的网页动画.这款动画效果非常炫.下面还有重播.慢速.和反向动画按钮.效果非常漂亮.一起看下效果图: 在线预览 源码下载 实现的代码. html代码: ...
- Node.js 动态网页爬取 PhantomJS 使用入门(转)
Node.js 动态网页爬取 PhantomJS 使用入门 原创NeverSettle101 发布于2017-03-24 09:34:45 阅读数 8309 收藏 展开 版权声明:本文为 winte ...
随机推荐
- 解决Vue在IE中报错出现不支持=>等ES6语法和“Promise”未定义等问题
在做VUE项目中大家可能会发现除了IE内核浏览器之外项目都能正常显示,但是到IE就萎了,这主要是IE不支持ES6的原因. 要解决这个我们要先引入browser.js,这样你可以使用ES2015(jav ...
- CentOS 安装 Mongodb详解 --- 有Linux基础
安装包:https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel70-3.4.1.tgz 安装过程 安装pstree小工具,以及其使用 关闭 ...
- springboot非web项目
使用CommandRunner @SpringBootApplication public class CrmApplication implements ApplicationRunner { @A ...
- docker-compose快速部署环境笔记
# 在含有 docker-compose.yml 的文件夹下 构建容器# 如有使用 Dockerfile 在修改 Dockerfile 文件之后再次执行如下即可应用修改docker-compose u ...
- Android Stuido中断点调试和高级调试
写一个简单的调试程序 import android.os.Bundle; import android.support.v7.app.AppCompatActivity; public class M ...
- Dropdown 下拉菜单
将动作或菜单折叠到下拉菜单中. 基础用法 移动到下拉菜单上,展开更多操作. 通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单.默认情况下,下拉按钮只要ho ...
- Eclipse使用高版本的jdk编译低版本的class文件的方法
如题,在这两天使用eclipse工具编译代码时,编译出来的class文件拿UE工具查看,版本为1.8版本的,而本地使用的tomcat版本是1.6的,运行中报错Unsupported major.min ...
- 作业类型维护流程(CO)
一.建立作业类型——kl01 目的: 藉由做作業類型執行生產報工 目錄路徑: 會計à成本控制à成本中心會計à主檔資料à作業類型à個別處理à KL01 - 建立 Transaction Code: ...
- centos 7安装python3及相关模块
一.python3安装 1.cd /usr/bin 2.mv python python.bak 3.https://www.python.org/ftp/python/网站选择合适的版本 4.wge ...
- 【Python开发】Python之re模块 —— 正则表达式操作
Python之re模块 -- 正则表达式操作 这个模块提供了与 Perl 相似l的正则表达式匹配操作.Unicode字符串也同样适用. 正则表达式使用反斜杠" \ "来代表特殊形式 ...