将下面这段代码添加到你的网页代码中即可
<script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
<script type="text/javascript">
L2Dwidget.init();
</script>
如果需要个性化 修改 也可以如下:
<script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
<script type="text/javascript">
L2Dwidget.init({
"display": {
"position": "left", // 定位位置("left"/"right"/"top"/"bottom")
"width": 350, // 宽度
"height": 600, // 高度
"hOffset": 0,
"vOffset": 20
},
"mobile": {
"show": true,
"scale": 0.5
},
"react": {
"opacityDefault": 1, // 透明度
"opacityOnHover": 0.2
},
"dialog":{
enable:true,
script:{
'tap body':'2',
'tap face':'3',
}
}
});
</script>
如果给自己的博客园添加,则可以在设置-html添加下面代码,并申请开通js即可展示出来
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
<script>
L2Dwidget.init({
"display": {
"position": "left", // 定位位置("left"/"right"/"top"/"bottom")
"width": 150, // 宽度
"height": 300, // 高度
"hOffset": 0,
"vOffset": 20
},
"mobile": {
"show": false,
"scale": 0.5
},
"react": {
"opacityDefault": 1, // 透明度
"opacityOnHover": 0.2
},
"dialog":{
enable:true,
script:{
'tap body':'2',
'tap face':'3',
}
}
});
</script>
</body>
</html>