之前在使用joe主题的时候，偶然发现一个非常有趣的小组件“旋转小人”。因自己折腾切换主题，很多东西都没有了，今天在逛原来的网站时，又发现了这个项目。一段简单的代码，就能实现"旋转小人"的效果，现在分享给大家。

效果展示

IMG_5152.gif
效果图有点拉胯，将就看吧。

代码

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>旋转小人 刘郎阁</title>
</head>
<body style="background-color: black; color: white;">

<div class="twopeople">
    <div class="container" style="height:200px;">
        <canvas class="illo" width="800" height="800" style="max-width: 200px; max-height: 200px; touch-action: none; width: 640px; height: 640px;"></canvas>
    </div>
    <script src="https://cdn.jsdelivr.net/gh/Justlovesmile/CDN/js/twopeople1.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/Justlovesmile/CDN/js/zdog.dist.js"></script>
    <script id="rendered-js" src="https://cdn.jsdelivr.net/gh/Justlovesmile/CDN/js/twopeople.js"></script>
    <style>
        .twopeople{
            margin: 0;
            align-items: center;
            justify-content: center;
            text-align: center;
        }
        canvas {
            display: block;
            margin: 0 auto;
            cursor: move;
        }
    </style>
</div>

</body>
</html>