2024年7月31日

生物組成層次的2048Game

 


2048這款經典遊戲應該不陌生吧?這是生物組成層次的版本,看看你是否可以從細胞一路組成生物圈?

一年前一位學生拿了這個遊戲,跟我說「老師你弄這個遊戲來給我玩啦」,因為當時我經常讓學生在課堂上使用我自製的許多教學遊戲,見此玩遊戲學生物連結

我說「好,我試試看」,但其實後來再也沒有試過。

直到前一陣子,我看到許多不會寫程式的朋友在分享著他們的發現,原來他們可以用AI生成技術寫出自己想要的教學小程式,隔天我在營隊上課前等待的時間,就想那我也來試試看吧。於是就用claude和chatgpt交互使用,果然一下子就做出來了。

只是需求是不斷更迭的,所以並不是直接就達到100%的效果,後面還是要花一些時間修改,花了一段時間,總算處理好在iOS上有卷軸滾動的問題,可以公開發表了。


最後是這樣解決的,在body的css設定 overscroll-behavior: none; 

而在遊戲的div上設定 overscroll-behavior: contain;