JavaScript實現的水果忍者遊戲,支援滑鼠操作
智慧手機剛剛普及時,水果忍者這款小遊戲可謂風靡一時。幾年過去了,現在,讓我們用純JavaScript來實現這個水果忍者遊戲,就算是為了錘鍊我們的JavaScript開發技能吧。
大家可以通過這個連結線上玩一玩(該連結是我的github地址):
http://i042416.github.io/FioriODataTestTool2014/WebContent/051_fruitninja.html
用滑鼠在網頁上劃一條橫線切正中的“New Game”的水果開始新的遊戲:
然後按住滑鼠左鍵不放,在螢幕上劃一條線,即可去切您中意的水果了。
玩法和手機上一樣簡單。
如果大家想定製化水果忍者這個遊戲,請從我的github上將水果忍者的原始碼clone或者下載到本地,然後自行修改:
https://github.com/i042416/FioriODataTestTool2014/
如果大家想修改在遊戲裡登場的水果圖示,直接把資料夾images/fruit下面的圖片檔案替換即可。以蘋果為例,apple.png代表完整的蘋果,apple-1.png和apple-2.png分別代表被切成兩半的蘋果左半部份和右半部份。
如果想修改遊戲音效,請將您喜歡的音效的mp3檔案放到sound資料夾下。
我們在玩這個遊戲時,如果在JavaScript檔案all.js的slice事件處理函式裡設定斷點,就能觀察到JavaScript實現是如何檢測水果刀(是否)切到了水果:collide.check:
如果大家覺得只有三次機會玩起來太不過癮了,那很容易,直接把showLseAt這個函式裡的number == 3的判斷條件改成比如number == 999, 這樣就可以幾乎無限制得玩啦!
有的朋友想作弊得更徹底一點,想達到即使切到炸彈,遊戲也不結束的效果。
那麼只需要修改sliceAt函式,如下圖if ( fruit.type != "boom")的紅色分支就是切到水果的分支,執行加分和顯示水果被切成兩半的效果。else的藍色分支是切到炸彈的分支,我們只需要將藍色分支內的程式碼註釋掉,遊戲就永遠不能結束了。不過這樣挺無聊的,哈哈!
這個遊戲的JavaScript版本的作者: https://github.com/ChineseDron/fruit-ninja
要獲取更多Jerry的原創技術文章,請關注公眾號"汪子熙"或者掃描下面二維碼:
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2212878/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- javascript實現前端小遊戲2048JavaScript前端遊戲
- 微軟XboxOne遊戲將支援鍵盤滑鼠操控微軟遊戲
- L3-012 水果忍者 (30分):貪心,幾何
- 荒神Aragami for mac(忍者潛行冒險遊戲)支援macOS 11.xGAMMac遊戲
- JavaScript、CSS實現滑鼠跟隨繁花效果JavaScriptCSS
- 用 JavaScript 實現簡單拼圖遊戲JavaScript遊戲
- html+css+JavaScript實現愛恩斯坦棋遊戲HTMLCSSJavaScript遊戲
- 安卓版 Google Sheets 表格應用支援滑鼠操作安卓Go
- 我和忍者理論團隊聊了聊這個“塗鴉忍者大戰鐵蛋女巫”的遊戲遊戲
- JavaScript實現垃圾分類小遊戲教程,附原始碼!JavaScript遊戲原始碼
- JavaScript 遊戲開發:手把手實現碰撞物理引擎JavaScript遊戲開發
- 讓JavaScript中setTimeout支援鏈式操作的方法JavaScript
- 遊戲侵蝕現實:產業的成熟,讓遊戲技術跨入現實遊戲產業
- VOODOO切水果遊戲霸榜美國 傳奇MMO在硬核小遊戲上火熱Odoo遊戲
- 遊戲中的陰影實現遊戲
- JavaScript滑鼠懸浮出現下拉選單效果JavaScript
- (完整原始碼)貪吃蛇小遊戲——HTML+CSS+JavaScript實現原始碼遊戲HTMLCSSJavaScript
- 用 JavaScript 和 C3 實現一個轉盤小遊戲JavaScript遊戲
- JavaScript實用的表格行滑鼠點選高亮效果JavaScript
- 小鎮青年的網遊實踐與現實生活:從“遊戲即生活”到“遊戲只是遊戲”遊戲
- js實現翻牌遊戲JS遊戲
- javascript遊戲引擎JavaScript遊戲引擎
- 小米遊戲滑鼠釋出:支援有線/無線雙模切換 售價249元!遊戲
- 遊戲滑鼠買什麼牌子好?2019年6款入門級電競遊戲滑鼠推薦遊戲
- .滑鼠點選愛心特效的實現特效
- 閉包:私有化變數 《JavaScript高程3》 《JavaScript忍者祕籍》變數JavaScript
- JS實現24點遊戲JS遊戲
- Python實現24點遊戲Python遊戲
- 現在的中國遊戲圈,能有多現實?遊戲
- 遊戲論·現實的媒介:MOBA遊戲與一個世界的症狀遊戲
- 雷柏V330遊戲滑鼠怎麼樣?雷柏V330遊戲滑鼠詳細評測遊戲
- 學習工作即遊戲:遊戲化生存的現實物語遊戲
- 小遊戲可以錄視訊、秀操作,互動分享的新形式展現遊戲更直觀遊戲
- 讓遠端桌面更好的支援遊戲遊戲
- 前端 javascript 練習題--表格的操作及進度條的實現【千鋒】前端JavaScript
- 乾貨分享 | UE遊戲滑鼠雙擊判定遊戲
- JavaScript /JS 如何實現陣列的建立,增加,刪除,遍歷等操作???JavaScriptJS陣列
- H5實現魔方遊戲H5遊戲