一朋友说昨天发了一个触屏下的图片墙在旋转的状态下有个BUG，实际上我也知道（所以我才没默认关闭旋转功能），这个问题现在已经解决，但之前走走了错路子解决了一大半发现有很大问题，就做个记录把BUG原理和错误的解法说一下，记录一下。
图片可以用两根手指的手势放大，处于放大状态的图片移动时不会切换到另外的图片上去，而是在图片的各细节部分移动。但当你把一个图片旋转一定度数后，会感觉移动的很别扭，为什么呢，先看图
图一：我先把一个图片顺时针旋转45度：
图二：我再屏幕上向右下方滑动，右边位移60，下边位移40，猜猜会怎样？
图三：是这样吗？
图四：再看看实际上是哪样:
看看，确实是向右向下位移了60/40，可是是针对你的图片的位移，而不是针对你的视觉的。
看了上面的图，问题的原因应该可以算理解了，如何解决呢确是一难。再回到图三看看，可以说图三是我实际上想要的结果，虽然计算是错的，如果是对的话，计算一下可以知道我应该向右移动70多，向上移动20多，又与我的手感冲突了。
之前我说了解决了问题的一大半，是我自己利用一些三角函数，和已知的倾斜度，偏移度,再转换为直角三角形去计算，让最终的结果算出来像我们视觉上期望的。
关于直角三角形过边长，这里还有个传送门http://test.xdnote.com/chapter-javascript/sin.html反过来也可以算角度。
算的不完全准确是一方面，关键是性能耗费看不过去，移动图片时，要看着流畅，在移动一小段距离可能出发移动事件100多次，如果每次都用这些复杂的算法计算一个期望值是很不合理的。而且还有不少种不同的场景，太多if,switch的代码个人也不太喜欢。
每次的灵感总是意外时忽然来临，比如去WC撒泡尿的时候回想一下，或是坐公交的时候脑震一下，往往可以从死胡同里走出来，不说了，解法很简单，把图片再拆为两个DIV层，上面的层负责移动与放大缩小，把旋转的部分扔给下面一层，就这么简单，原理如下：
