鼠标点击烟花效果

1.目标——svg烟花（难度：4.3）

我们的目标是当鼠标点击页面时，点击处会绽开彩色的烟花. 烟花会逐渐滑落消失，滑落时会留下轨迹.烟花每个分支的形状为实心或空心的各种形状.

2.分析需求——庖丁解牛

1.鼠标点击页面时，需将鼠标的clientX,clientY这个窗口坐标，转换成SVG的画布坐标，以便以该坐标为中心，生成烟花

2.烟花有很多，要尽量避免在文档中频繁地插入删除SVG节点，否则效率很低，我们维护两个队列，一个存储动画节点，一个存放备用节点，用JS写个链表类，因为链表的插入删除比数组快

3.烟花绽开时，每个烟花都会从烟花中心飞出，有个随机的初始速度，同时自由落体，这个动画需要自己实现，而不是借助SMIL动画，所以本案例兼容性很好

4.另外本例需要读者具备JS对象的相关基础知识

。。。

原代码和详细教程请下载附件:

链接：https://pan.baidu.com/s/17jsGg2r7VI848V2AG-TdUA 
提取码：jua8