17 | <!DOCTYPE html>
18 | <html xmlns="http://www.w3.org/1999/xhtml">
19 | <head>
20 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
21 | <title>Live2D 看板娘 v1.4 / Demo 2</title>
22 | </head>
23 | <body style="font-family: 'Microsoft YaHei';">
24 | <h2><a href="https://www.fghrsh.net/post/123.html" style="color: #38A3DB; text-decoration: none;">Live2D 看板娘 v1.4</a> / Demo 2</h2>
25 | <h3> - 自动加载 autoload.js <span style="font-size: 12px;color: #666">(一般网站引用推荐)</span></h3>
26 | <ul>
27 | <li><a href="demo1-default.html" style="color: #38A3DB; text-decoration: none;" title="常规博客引用推荐">Demo 1 - 常规引用</a></li>
28 | <li><span title="一般网站引用推荐">Demo 2 (当前面页)</span></li>
29 | <li><a href="demo3-waifu-tips.html" style="color: #38A3DB; text-decoration: none;" title="博客园等网站引用推荐">Demo 3 - 内置 waifu-tips.json</a></li>
30 | </ul>
31 |
32 | <!-- waifu-tips.js 依赖 JQuery 库 -->
33 | <script src="assets/jquery.min.js?v=3.3.1"></script>
34 |
35 | <!-- 实现拖动效果，需引入 JQuery UI -->
36 | <script src="assets/jquery-ui.min.js?v=1.12.1"></script>
37 |
38 | <!-- 使用 aotuload.js 引入看板娘 -->
39 | <script src="assets/autoload.js?v=1.4.2"></script>
40 | </body>
41 | </html>
42 |
43 | # autoload.js
44 | try {
45 | $("<link>").attr({href: "assets/waifu.min.css?v=1.4.2", rel: "stylesheet", type: "text/css"}).appendTo('head');
46 | $('body').append('<div class="waifu"><div class="waifu-tips"></div><canvas id="live2d" 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>');
47 | $.ajax({url: 'assets/waifu-tips.min.js?v=1.4.2',dataType:"script", cache: true, async: false});
48 | $.ajax({url: 'assets/live2d.min.js?v=1.0.5',dataType:"script", cache: true, async: false});
49 | /* 可直接修改部分参数 */
50 | live2d_settings['hitokotoAPI'] = 'hitokoto.cn'; // 一言 API
51 | live2d_settings['modelId'] = 5; // 默认模型 ID
52 | live2d_settings['modelTexturesId'] = 1; // 默认材质 ID
53 | live2d_settings['modelStorage'] = false; // 不储存模型 ID
54 | /* 在 initModel 前添加 */
55 | initModel('assets/waifu-tips.json');
56 | } catch(err) { console.log('[Error] JQuery is not defined.') }
57 |
18 | <!DOCTYPE html>
19 | <html xmlns="http://www.w3.org/1999/xhtml">
20 | <head>
21 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
22 | <title>Live2D 看板娘 v1.4 / Demo 1</title>
23 | <link rel="stylesheet" type="text/css" href="assets/waifu.min.css?v=1.4.2"/>
24 | </head>
25 | <body style="font-family: 'Microsoft YaHei';">
26 | <h2><a href="https://www.fghrsh.net/post/123.html" style="color: #38A3DB; text-decoration: none;">Live2D 看板娘 v1.4</a> / Demo 1</h2>
27 | <h3> - 常规引用 <span style="font-size: 12px;color: #666">(常规博客引用推荐)</span></h3>
28 | <ul>
29 | <li><span title="常规博客引用推荐">Demo 1 (当前面页)</span></li>
30 | <li><a href="demo2-autoload.html" style="color: #38A3DB; text-decoration: none;" title="一般网站引用推荐">Demo 2 - 自动加载 autoload.js</a></li>
31 | <li><a href="demo3-waifu-tips.html" style="color: #38A3DB; text-decoration: none;" title="博客园等网站引用推荐">Demo 3 - 内置 waifu-tips.json</a></li>
32 | </ul>
33 |
34 | <!-- waifu-tips.js 依赖 JQuery 库 -->
35 | <script src="assets/jquery.min.js?v=3.3.1"></script>
36 |
37 | <!-- 实现拖动效果，需引入 JQuery UI -->
38 | <script src="assets/jquery-ui.min.js?v=1.12.1"></script>
39 |
40 | <div class="waifu">
41 | <div class="waifu-tips"></div>
42 | <canvas id="live2d" class="live2d"></canvas>
43 | <div class="waifu-tool">
44 | <span class="fui-home"></span>
45 | <span class="fui-chat"></span>
46 | <span class="fui-eye"></span>
47 | <span class="fui-user"></span>
48 | <span class="fui-photo"></span>
49 | <span class="fui-info-circle"></span>
50 | <span class="fui-cross"></span>
51 | </div>
52 | </div>
53 |
54 | <script src="assets/waifu-tips.min.js?v=1.4.2"></script>
55 | <script src="assets/live2d.min.js?v=1.0.5"></script>
56 | <script type="text/javascript">
57 | /* 可直接修改部分参数 */
58 | live2d_settings['modelId'] = 1; // 默认模型 ID
59 | live2d_settings['modelTexturesId'] = 87; // 默认材质 ID
60 | live2d_settings['modelStorage'] = false; // 不储存模型 ID
61 | live2d_settings['canCloseLive2d'] = false; // 隐藏 关闭看板娘 按钮
62 | live2d_settings['canTurnToHomePage'] = false; // 隐藏 返回首页 按钮
63 | live2d_settings['waifuSize'] = '600x535'; // 看板娘大小
64 | live2d_settings['waifuTipsSize'] = '570x150'; // 提示框大小
65 | live2d_settings['waifuFontSize'] = '30px'; // 提示框字体
66 | live2d_settings['waifuToolFont'] = '36px'; // 工具栏字体
67 | live2d_settings['waifuToolLine'] = '50px'; // 工具栏行高
68 | live2d_settings['waifuToolTop'] = '-60px'; // 工具栏顶部边距
69 | live2d_settings['waifuDraggable'] = 'axis-x'; // 拖拽样式
70 | /* 在 initModel 前添加 */
71 | initModel("assets/waifu-tips.json?v=1.4.2")
72 | </script>
73 | </body>
74 | </html>
75 |