网页/博客Hexo添加live2d游戏角色看板娘,简易添加，碧蓝航线等live2d新型游戏角色模型（moc3）

目前博客上常见live2d看板娘很多都已经是比较老的了（旧版的是moc文件的）并且相应的插件不支持新版模型（moc3文件），如碧蓝航线的live2d模型。本篇介绍在网页里引入moc3文件的方法

示例网站1
示例网站2
示例网站3

把游戏角色添加到自己的博客/网站作为看板，附带鼠标点击/触碰效果，效果截图如下

demo1
demo2
demo3

demo4
demo5

引入方法、更多角色模型请参考原项目文档

代码示例

复制这段代码保存到空的html文件中，在浏览器打开即可看到效果

<!DOCTYPE html>
<html >
<head><meta charset="UTF-8"><title>live2d-demo</title><script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script><!-- Live2DCubismCore --><script src="https://cdn.jsdelivr.net/gh/litstronger/live2d-moc3@master/js/frame/live2dcubismcore.min.js"></script><!-- Include Pixi. --><script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.6.1/pixi.min.js"></script><!-- Include Cubism Components. --><script src="https://cdn.jsdelivr.net/gh/litstronger/live2d-moc3@master/js/live2dcubismframework.js"></script><script src="https://cdn.jsdelivr.net/gh/litstronger/live2d-moc3@master/js/live2dcubismpixi.js"></script><!-- User's Script --><script src="https://cdn.jsdelivr.net/gh/litstronger/live2d-moc3@master/js/l2d.js"></script><script src="https://cdn.jsdelivr.net/gh/litstronger/live2d-moc3@master/js/main.js"></script><style></style>
</head>
<body><!-- Canvas --><div class="Canvas"  id="L2dCanvas"></div><script>/* 配置 */var config = {width: window.innerWidth, /* 窗口宽度最大值 */height: window.innerHeight, /* 窗口高度最大值 */left: '0px',bottom: '0px',basePath: 'https://cdn.jsdelivr.net/gh/alg-wiki/AzurLaneL2DViewer@gh-pages/assets',role: 'bisimai_2',background: 'https://cdn.jsdelivr.net/gh/alg-wiki/AzurLaneL2DViewer@gh-pages/assets/bg/bg_church_jp.png',opacity: 1}var v = new Viewer(config); </script>
</body>
</html>

如果喜欢该项目，不要忘记给项目一个star噢！

网页/博客Hexo添加live2d游戏角色看板娘,简易添加，碧蓝航线等live2d新型游戏角色模型（moc3）相关推荐

Hexo博客NexT主题美化之新增看板娘(能说话、能换装)
前言更多效果展示,请访问我的个人博客. 效果图: 教程: 小白水平: hexo的官方是支持看板娘的,已经封装好了插件,但只是模型,不能说话.不能换装.功能较少. 安装模块,如下: npm inst ...
手把手教你快速搭建个人博客 Hexo + Github
平时学习查找资料发现了很多个人博客,搭建的很不错,一直想抽空自己也动手实践一下,正好趁着新型冠状肺炎这段宅在家的空,赶紧搭建一下自己的个人博客先来预览一下博主的个人博客:Fly's Blog 动手能 ...
静态博客 Hexo material 主题安装
静态博客 Hexo material 主题安装注意,这里介绍的 Material 主题是 1.5.2 的版本如果你还没有安装 Hexo,并且对它有兴趣,请前往 EasyHexo 这里将提供 Hex ...
搭建博客hexo 安装hexo、配置hexo、hexo主题美化和添加live2d看板娘--详细步骤
一.安装hexo 1.下载安装软件 git:https://git-scm.com/downloads node:https://nodejs.org/en/ 2.安装好两个工具之 ...
html给看板娘添加语音,如何给你的Jekyll博客添加可爱的二次元看板娘(Live2D)
8种机械键盘轴体对比本人程序员,要买一个写代码的键盘,请问红轴和茶轴怎么选? 有朋友问这个右下角的小东西是怎么弄出来的,今天就手把手教你.请往下看: Live2D Add the Sseexxyyy ...
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内设置可爱的动漫小人（九）
1.安装模块 hexo博客根目录选择cmd命令窗口或者git bash 输入以下代码,安装插件 npm install --save hexo-helper-live2d 各种模型展示 live2d- ...
用 Flask 来写个轻博客 (25) — 使用 Flask-Principal 实现角色权限功能
Blog 项目源码:https://github.com/JmilkFan/JmilkFan-s-Blog 目录目录前文列表扩展阅读 Flask-Principal 使用 Flask-Princ ...
让搜索引擎收录hexo博客 | hexo
当我们一开始建完博客时,搜索引擎是搜索不到的,我们需要做一项工作就是通知搜索引擎收录我们的网站. 如何被百度收录这里需要做两个事情,一个是验证网站,一个是链接提交. 验证网证我们到百度站长平台里面 ...
github博客Hexo引流到微信
相信有不少小伙伴都在github上创建了属于自己的博客,其中用Hexo的Next主题应该不少,那么,我们究竟该如何将博客的流量引流到微信呢?今天就来带你看一看. 如何引流现在网上有一种套路,当你在看 ...

网页/博客Hexo添加live2d游戏角色看板娘,简易添加，碧蓝航线等live2d新型游戏角色模型（moc3）

引入方法、更多角色模型请参考原项目文档

代码示例

网页/博客Hexo添加live2d游戏角色看板娘,简易添加，碧蓝航线等live2d新型游戏角色模型（moc3）相关推荐

最新文章

热门文章