博客美化—添加萌萌的live2D看板娘(不能再简单了)
看着很多博客都有live2D的萌萌哒看板娘，我闲着有空说干就干。
- 从参考博客的附件中下载资源文件
- waifu.css
- waifu-tips.js
- live2d.js
- flat-ui.min.css//若不加菜单可以不引入
- 上传资源文件到博客园
- 申请js权限
- 设置博客园页脚Html代码(其中的资源文件可以替换成你自己的url)
页脚Html代码
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lgjbky/waifu.css"/>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lgjbky/flat-ui.min.css"/>
</head>
<body>
<div class="waifu">
<div class="waifu-tips"></div>
<canvas id="live2d" width="280" height="250" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>
<script src="https://blog-static.cnblogs.com/files/lgjbky/waifu-tips.js"></script>
<script src="https://blog-static.cnblogs.com/files/lgjbky/live2d.js"></script>
<script type="text/javascript">initModel()</script>
</body>
</html>
参考
- https://www.fghrsh.net/post/123.html #发源地
- https://www.cnblogs.com/yjlblog/p/8724881.html # 可以参考
- http://www.cnblogs.com/clwydjgs/p/9291283.html #有误导的嫌疑
博客美化—添加萌萌的live2D看板娘(不能再简单了)的更多相关文章
- 【全网最全的博客美化系列教程】01.添加Github项目链接
全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...
- 【全网最全的博客美化系列教程】02.添加QQ交谈链接
全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...
- 【博客美化】08.添加"扩大/缩小浏览区域大小" 按钮
博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...
- 【博客美化】06.添加QQ交谈链接
博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...
- 【博客美化】05.添加GitHub链接
博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...
- 【全网最全的博客美化系列教程】08.自定义地址栏Logo
全网最全的博客美化系列教程相关文章目录 [全网最全的博客美化系列教程]01.添加Github项目链接 [全网最全的博客美化系列教程]02.添加QQ交谈链接 [全网最全的博客美化系列教程]03.给博客添 ...
- Hexo 添加Live2D看板娘
title: Hexo 添加 Live2D看板娘 二次元什么的最喜欢了[大好きです] 准备 项目地址 live2d模型 部分模型预览 开始 首先进入Hexo博客根目录安装live2d插件 $ npm ...
- 在博客中增加自己的live2d纸片人模型方法
目录 在博客中增加自己的live2d纸片人模型 准备工具 使用步骤 附件 在博客中增加自己的live2d纸片人模型 准备工具 github仓库:存放live2d模型和json文件 如果你的博客支持本地 ...
- 【博客美化】04.自定义地址栏logo
博客园美化相关文章目录: [博客美化]01.推荐和反对炫酷样式 [博客美化]02.公告栏显示个性化时间 [博客美化]03.分享按钮 [博客美化]04.自定义地址栏logo [博客美化]05.添加Git ...
随机推荐
- python 在线生成文字云
在线生成文字云 在线生成文字云地址 http://a.leechg.com:8080/wordcloud 效果图 大体步骤 1 接收请求中的文本,通过结巴分词处理文本. seg_generator ...
- java字符串类型和时间类型的转换
类型转换 //reqeust.getParameter获取字符串直接赋值 1 public static Date date(String date_str) { try { Calendar zca ...
- SignalR 教程二 服务端广播
转帖官方教程:Tutorial: Server Broadcast with SignalR 2 http://www.asp.net/signalr/overview/getting-started ...
- 关于session序列化和session钝化和活化
在第一次启动服务器后,在session中放入一个对象.在页面可以获得,当重启服务器,但是没有关闭浏览器的情况下刷新页面仍然能够获得这个对象,前提是这个对象必须实现了java.io.Serializab ...
- 关于MySQL优化问题
众所周知在数据量庞大的情况下普通的SQL语句已经满足不了我们的需要了,这个时候就需要DBA去进行数据库的优化,而我们作为一名开发人员不能对数据库进行优化这时该怎么办呢?答案是只能在SQL语句上面进行优 ...
- 利用ascii码生成26个英文字母
<script> let a = ""; for (var i = 65; i < 91; i++) { a += String.fromCharCode(i); ...
- 可以提高php编程效率的20个要点
整理了可以提高php编程效率的20个要点,发博客记录一下,需要的朋友可以参考. 1.如果能将类的方法定义成static,就尽量定义成static,它的速度会提升将近4倍. 2.$row['id' ...
- pyhton新手学习之增删改查
一 .列表的定义 1.列表的定义 names = [ "xiajiqni", "test", "wangwu","oldb ...
- Leecode刷题之旅-C语言/python-349两个数组的交集
/* * @lc app=leetcode.cn id=349 lang=c * * [349] 两个数组的交集 * * https://leetcode-cn.com/problems/inters ...
- pylearn2报错缺少theano.compat.six
按照官网的顺序下载 会出现缺少theano.compat.six的报错 纠结了一天,各种查,最后终于找到解决方法,theano安装有问题 不能安装最新版本,即pip的时候theano==0.7.0,然 ...