将看板娘(Live2D)模型修改为血小板

Shaka 5月前 ⋅ 690 阅读

 

首先感谢猫与向日葵博客制作的看板娘-血小板。查看地址

然后我盗张大图o(∩_∩)o 哈哈,这个血小板真的太可爱了。

我这次属于直接拿了博主的劳动成功,还请见谅。

 

下面分享下如何将之前失效的看板娘整出来。

本博客之前的api连接由于访问量过大已经禁止了部分访问,看板娘看不到皮肤了,实在可怜。

于是上午做了自己的api接口连接:

'http://blog.177kankan.com/theme/default/live2d/model.json'

1.替换原waifu.tips.js中的API失效接口

function loadModel(modelId, modelTexturesId){
// localStorage.setItem('modelId', modelId);
// if (modelTexturesId === undefined) modelTexturesId = 0;
// localStorage.setItem('modelTexturesId', modelTexturesId);
loadlive2d('live2d','http://blog.177kankan.com/theme/default/live2d/model.json'/*'https://api.fghrsh.net/live2d/get/?id='+modelId+'-'+modelTexturesId*/, console.log('live2d','模型加载完成'));
}

因为没有设置很多个皮肤,目前只有小可爱-血小板一个。所以modelId,modelTexturesId都可以忽略了。

2.修改原CSS样式

.waifu {
position: fixed;
bottom: 0;
right: 0;
z-index: 1;
font-size: 0;
transition: all .3s ease-in-out;
-webkit-transform: translateY(3px);
transform: translateY(3px);
}
.waifu-tips {
opacity: 0;
width: 250px;
height: 70px;
top: -5px;
right: 10px;
padding: 5px 10px;
border: 2px solid rgb(57, 57, 57);
background-color: #fff;
font-size: 13px;
text-overflow: ellipsis;
overflow: hidden;
position: absolute;
animation-duration: 50s;
animation-iteration-count: infinite;
animation-name: shake;
animation-timing-function: ease-in-out;
}
.waifu-tool span {
display: block;
cursor: pointer;
color: rgb(57, 57, 57);
background-color: #fff;
border: 2px solid rgb(57, 57, 57);
padding: 0 4px;
margin-bottom: 2px;
line-height: 20px;
transition: 0.2s;
animation-duration: 30s;
animation-iteration-count: infinite;
animation-name: shake;
animation-timing-function: ease-in-out;
}

大功告成。

然后感谢FGHRSH的博客此前提供的API。


注意:本文归作者所有,未经作者允许,不得转载

全部评论: 0

    我有话说: