Javascript"拼图"具有不规则的.png形状

Eri*_*yer 5 javascript css jquery png alpha

Soooo,我想要做的实际上是一个拼图游戏.在左侧是一个堆叠十几个重叠.png文件的"撕开"纸片(所有不同的不规则形状与alpha)的区域,当放在一起时,按顺序在右侧,形成一张纸附有说明.视觉(忽视旋转件):

在此输入图像描述 我所知道的并不是什么新东西,但我在开发它时的两个主要注意事项是它必须在ie8 +和触摸设备上工作.所以这意味着没有闪光(这将是非常容易的)和没有画布(愚蠢的ie); 这给我留下了js和svg?

js中的拖放部分很容易,但我遇到的问题是,我确定你知道,alpha通道被忽略,不规则的撕裂片实际上是一个矩形.这使得这个不可用,因为碎片是堆叠的,彼此重叠.

我可以通过使用图像映射并在翻转时设置变量来对丢弃进行粒度命中检测.

我已经环顾了很多(这里+谷歌)并尝试了一些想法,但我无法解决不规则的形状选择/拖动问题.有任何想法吗?

谢谢你的时间.

Ach*_*les 1

ExplorerCanvas不适合您吗?我认为这将允许您创建一个基于画布的解决方案。这比通过 javascript 进行纯 html 元素操作要好得多

  • “是不是τ”?那是怎么发生的? (3认同)