JS入门笔记九：循环精灵图案例

在开发中，精灵图往往是按照一定规律制作的，前端程序员往往可以借助其规律来快速制作相应的图标，提升开发效率。

操作步骤：
1.寻找精灵图的排布规律
2.按照规律改变背景位置

以淘宝为例

这是淘宝精灵图的一部分，通过测量可知每个小图片间的间隔为22px,且图片大小为2222，所有每个精灵图在x轴的坐标为0，在y轴的坐标为-44(i-1),如第一张精灵图的x为0，y为-44*（1-1）=0；由此规律，我们利用循环就可以将其全部制作。