用javascript怎么怎么制作一个拼图游戏?
1个回答
展开全部
拼图的游戏 重在思路.如果你基础过关的话...
下面我给你个游戏思路吧...
拼图这个
一,游戏思路是很简单的...
每个碎片都有一个有序号.每移动一次都检测一下所有的碎片是否都按有序号排列.是就过关...原理就这么简单...
打个比方: 我把一张图 打散成N片....每一片都有一个序号,比如:1,2,3
当用户移动一下 就检测是否所有的碎片已按序号排好,排好就过关...
二,技术思路:(以下我写的是伪代码,比如:(obj.style.width/n),那肯定得不到结果的,因为obj.style.width是个字符串.应该是:parseInt(obj.style.width)/n
1,打散图片,如何打散碎片呢?
这个其实可以用JS做一个FOR循环 ,为正张图片铺上等大小的格子(div).当然你会用(obj.style.width/n)这样计算.每一个格当前的 div[i].obj.offsetTop-img.offsetTop ,div[i].offsetLeft-img.offsetLeft..这时按照这个可以为每一个碎片DIV加上一个background-image:url(xxx);position:x,y;当然 这里的x,y你应该知道是什么了吧..这样就把图片打散到每个格子里了..
2,如何移动.这个不用我说了吧.当然是做DIV碎片的时候 多做一个出来,而且是空白的,也就是没背景的..
3,打乱.这个也很简单,执行一次随机 随机地把它们的位置调换就行了...
作为一个游戏,我只能为你提供思路到这了...一整套的思路
下面我给你个游戏思路吧...
拼图这个
一,游戏思路是很简单的...
每个碎片都有一个有序号.每移动一次都检测一下所有的碎片是否都按有序号排列.是就过关...原理就这么简单...
打个比方: 我把一张图 打散成N片....每一片都有一个序号,比如:1,2,3
当用户移动一下 就检测是否所有的碎片已按序号排好,排好就过关...
二,技术思路:(以下我写的是伪代码,比如:(obj.style.width/n),那肯定得不到结果的,因为obj.style.width是个字符串.应该是:parseInt(obj.style.width)/n
1,打散图片,如何打散碎片呢?
这个其实可以用JS做一个FOR循环 ,为正张图片铺上等大小的格子(div).当然你会用(obj.style.width/n)这样计算.每一个格当前的 div[i].obj.offsetTop-img.offsetTop ,div[i].offsetLeft-img.offsetLeft..这时按照这个可以为每一个碎片DIV加上一个background-image:url(xxx);position:x,y;当然 这里的x,y你应该知道是什么了吧..这样就把图片打散到每个格子里了..
2,如何移动.这个不用我说了吧.当然是做DIV碎片的时候 多做一个出来,而且是空白的,也就是没背景的..
3,打乱.这个也很简单,执行一次随机 随机地把它们的位置调换就行了...
作为一个游戏,我只能为你提供思路到这了...一整套的思路
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询