如何使用H5页面实现以下效果(javascript实现)

Question

1. 屏幕中随机产生n个蓝色大小不一的气泡，坐标随机

2. 红色气泡跟随鼠标移动

3. 当红色气泡会与蓝色气泡发生碰撞效果(类似桌球)

4. 红色气泡会被屏幕边缘阻挡

5. 蓝色气泡左右屏上下屏互通

6. 蓝色气泡的运动及互动行为请自由发挥

Answer 1

可以使用canvas实现1、将泡泡做成一个公用的生产方法2、监控鼠标在canvas上的相对位置3、4、碰撞效果可以使用物理加速度计算方向和速度+动画刷新5、边缘特殊处理你这是一个题目吧。