效果预览

网页上：

小程序中：
在微信小程序中使用时，将div标签改成view即可。

小程序中封装

如下，在小程序中可封装成组件（方便使用）

1、先在components目录下新建一个目录存放该组件。

2、右键上一步新建的目录，选择新建Component我这里命名为catSwinging，会在目录下自动生成4个文件。

3、在你要使用该组件的页面json文件的usingComponents标签内注册组件，或者在app.json文件全局注册该组件，这样所有页面都能直接使用。

{
  "usingComponents": {
    "cat-swinging": "../../components/cat-swinging/catSwinging"
  }
}

4、使用封装好的组件：在页面中通过cat-swinging标签(或者你在json中自定义的名称)即可。

<view class="cat" bindtap="clickMyCat">
  <cat-swinging/>
</view>

.cat{
  z-index: 99999;
}

获取源码

在公众号遇见0和1窗口回复猫咪小挂件即可获取到该完整源码，若分享链接失效或有其他问题可直接进群反馈获取。