遊戲介紹
這是一款非常簡單的網頁小遊戲。在小動物的前面的路上有美味的食物,然而擋在它面前的是一個方形的坑,要想拿到食物並須用土塊把坑填上再過去。按住屏幕放大土塊,鬆開手指讓土塊落下並填到坑裏。如果土塊太大,土塊無法填入坑裏,小動物將被擋住;如果土塊太小,小動物會陷在坑裏。因此土塊的大小非常重要。熱心的你快來幫忙吧!
遊戲製作
遊戲基於CSS3和Javascript實現,在PC和移動端的瀏覽器中均可運行。遊戲中的動畫效果主要使用CSS3 transition屬性來實現。關於CSS3 transition,請戳W3School CSS3 transition瞭解更多。
此外,按住屏幕放大土塊的動畫效果使用Javascript實現,邏輯如下:按下屏幕(mousedown/touchstart)時啓動一個周期函數(setInterval),在該函數中增大土塊的邊長並重繪土塊;擡起手指(mouseup/touchend)時清除周期函數(clearInterval),停止擴大土塊。