基于canvas的手风琴特效

引言：手风琴特效是比较常见的，我之前没有见过用canvas写的，就自己上手写了一个，拿出来分享一下，这其中处理图片的切换花了我不少时间。

效果如下

实现思路

1.排放好图片，最前面的那张图片显示全部，其他图片放到两侧只显示20像素的边，剩余部分依次摆放放到画布外。

2.绘制几个相对应的方形，每个方形大小跟对应的图片显示在画布中的大小一样，这些方形用来控制鼠标的移入事件。

3.鼠标移入以后，切换图片，执行手风琴特效。

绘制图片

分二次处理是为了让展示的图片处于数组的后面，不会被遮盖。

//绘制选项图片
	Accordion.prototype.drawImage=function(){
		var image,img,rect,x=0,sx=0,sy=0,sWidth=600,sHeight=360,dx=0,dy=0,dWidth=