博客右下角的动态人物(live2d)

效果:
在这里插入图片描述
那只猫咪不用管,是谷歌得插件

<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script>
    L2Dwidget.init({
        "model": {
       //jsonpath控制显示那个小萝莉模型,
			//(切换模型需要改动)
//				"https://unpkg.com/(live2d-widget-model-koharu)@1.0.5/assets/(koharu).model.json"
            jsonPath: "https://unpkg.com/[email protected]/assets/koharu.model.json",
            "scale": 1
        },
        "display": {
            "position": "right", //看板娘的表现位置
            "width": 150,  //小萝莉的宽度
            "height": 300, //小萝莉的高度
            "hOffset": 0,
            "vOffset": -20
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 0.7,
            "opacityOnHover": 0.2
        }
    });
</script>

切换模型需要手动切换模型链接
其他模型:点击查看其他模型
----------------------------------------------------------------分割线------------------------------------------------------------------
另一个更强大一些,有7个模型,直接那旁边的按钮就可以切换,但是切换有点慢(第一个模型有70+的衣服,其他模型没试)
效果:
在这里插入图片描述
复制黏贴直接用

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
	</head>
	<body>
	</body>
	<script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget/autoload.js"></script>
</html>

或者是想要自己写的:
项目链接:github
参考链接:点击对了
或者:自建模型

发布了31 篇原创文章 · 获赞 32 · 访问量 1283

猜你喜欢

转载自blog.csdn.net/weixin_45936690/article/details/103989848