前端——原生HTML猫猫max桌宠（附源码）

一、前言

看见了max大佬和狗头人大佬做的一个桌宠，于是就像用web简单实现一下

二、代码包 

https://wwwf.lanzout.com/iWfER0ze0cqd
密码:fg88

 三、简单效果

简单用了随机动作（可以进行权重设置）

---

四、踩坑情况

如果不是主循环loop里，这里不能用这个，会导致开启多个loop循环

animationId = requestAnimationFrame(loop);  // 浏览器提供的 API，用于优化动画性能并在重绘之前在主线程上执行指定的函数

 定时器在函数里面设置时，最好挂载到全局变量上！方便后面销毁！

1、初始化变量

2、创建定时器（在函数中） 

3、清除定时器

 ico图标和cur图标都可以在web中应用！

注意：他们的大小不能超过32x32像素 ！！！

给父盒子设置了点击监听器——点击子盒子就无法触发监听器！！

解决方法：把子盒子设置为不可点击即可！！！

.cywl img {
    width: 90px;
    height: 90px;
    /* 无法选中 */
    pointer-events: none;
    user-select: none;
}

五、主页面代码