旋转合并照片墙-特效照片墙

思路：

首先预加载照片，分大图小图两个循环预加载函数，共48张图片，count记录循环次数，count==48时执行loadSuccess()中代码。

先让照片显示在div中，然后定位隐藏在左上角，然后计算每张图片应该在的位置，设置其left和top。使用transition语法让他们动态显示，并且设置不同的延迟时间TransitionDelay让他们一张一张显示，并且有一个随机角度（循环用双层循环，因为分为行和列）。

1）在div中加入span，存放定位的大图（初始隐藏）， 点击某一图片时，div边框大小改变，取消随机角度，重新计算left和top并设置给div，所有span（不同定位）组成当前图片的大图并显示，显示上一个和下一个按钮（记录点击图片的索引，以实现上一个和下一个功能）。

2） 隐藏span，恢复边框、随机角度、展开时的top和left值，取消TransitionDelay（展开时没有延迟）。

在这个点击事件中，需要判断当前状态图片是展开还是合并，var flag = true用 flag记录（true是打开）最后flag = !flag; 取反。如果打开的，则合并执行 1）；else则打开执行 2）。

上一个和下一个功能：轮播图原理，增加一个随机延迟时间来更换图片的动画（TransitionDelay = Math.random() * 500 + 'ms'）。

ps：小图125*125   大图750*500

图片网盘 

蛋糕网盘 https://pan.baidu.com/s/14xTrLklWHpD_NCo7uTVfCA

也可以替换成这个蛋糕图片