智能手機(jī)剛剛普及時(shí),水果忍者這款小游戲可謂風(fēng)靡一時(shí)。幾年過(guò)去了,現(xiàn)在,讓我們用純JavaScript來(lái)實(shí)現(xiàn)這個(gè)水果忍者游戲,就算是為了錘煉我們的JavaScript開(kāi)發(fā)技能吧。
10年積累的成都做網(wǎng)站、成都網(wǎng)站建設(shè)經(jīng)驗(yàn),可以快速應(yīng)對(duì)客戶對(duì)網(wǎng)站的新想法和需求。提供各種問(wèn)題對(duì)應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你,你也不認(rèn)識(shí)我。但先制作網(wǎng)站后付款的網(wǎng)站建設(shè)流程,更有信陽(yáng)免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。大家可以通過(guò)這個(gè)鏈接在線玩一玩(該鏈接是我的github地址):
http://i042416.github.io/FioriODataTestTool2014/WebContent/051_fruitninja.html
用鼠標(biāo)在網(wǎng)頁(yè)上劃一條橫線切正中的“New Game”的水果開(kāi)始新的游戲:
然后按住鼠標(biāo)左鍵不放,在屏幕上劃一條線,即可去切您中意的水果了。
玩法和手機(jī)上一樣簡(jiǎn)單。
如果大家想定制化水果忍者這個(gè)游戲,請(qǐng)從我的github上將水果忍者的源代碼clone或者下載到本地,然后自行修改:
https://github.com/i042416/FioriODataTestTool2014/
如果大家想修改在游戲里登場(chǎng)的水果圖標(biāo),直接把文件夾images/fruit下面的圖片文件替換即可。以蘋(píng)果為例,apple.png代表完整的蘋(píng)果,apple-1.png和apple-2.png分別代表被切成兩半的蘋(píng)果左半部份和右半部份。
如果想修改游戲音效,請(qǐng)將您喜歡的音效的mp3文件放到sound文件夾下。
我們?cè)谕孢@個(gè)游戲時(shí),如果在JavaScript文件all.js的slice事件處理函數(shù)里設(shè)置斷點(diǎn),就能觀察到JavaScript實(shí)現(xiàn)是如何檢測(cè)水果刀(是否)切到了水果:collide.check:
如果大家覺(jué)得只有三次機(jī)會(huì)玩起來(lái)太不過(guò)癮了,那很容易,直接把showLseAt這個(gè)函數(shù)里的number == 3的判斷條件改成比如number == 999, 這樣就可以幾乎無(wú)限制得玩啦!
有的朋友想作弊得更徹底一點(diǎn),想達(dá)到即使切到炸彈,游戲也不結(jié)束的效果。
那么只需要修改sliceAt函數(shù),如下圖if ( fruit.type != "boom")的紅色分支就是切到水果的分支,執(zhí)行加分和顯示水果被切成兩半的效果。else的藍(lán)色分支是切到炸彈的分支,我們只需要將藍(lán)色分支內(nèi)的代碼注釋掉,游戲就永遠(yuǎn)不能結(jié)束了。不過(guò)這樣挺無(wú)聊的,哈哈!
這個(gè)游戲的JavaScript版本的作者: https://github.com/ChineseDron/fruit-ninja
要獲取更多Jerry的原創(chuàng)技術(shù)文章,請(qǐng)關(guān)注公眾號(hào)"汪子熙"或者掃描下面二維碼: