生活随笔
收集整理的這篇文章主要介紹了
移动应用开发——作业3
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
題目一:使用Javascript代碼編寫一個“杭州亞運會倒計時”網頁,要求適合于手機上展示。時間能精確到秒,顯示的時間格式,可自己定,例如:286天12時36分20秒。
截圖和效果說明:
主要源代碼和說明:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>作業3.1</title><script type="text/javascript">function getTime() {var NowTime = new Date();var StartTime = new Date('2022/9/10 00:00:00');var time = StartTime.getTime() - NowTime.getTime();var d=Math.floor(time/1000/60/60/24);var h=Math.floor(time/1000/60/60%24);var m=Math.floor(time/1000/60%60);var s=Math.floor(time/1000%60);document.getElementById("day").innerHTML = d + "日";document.getElementById("hour").innerHTML = h + "時";document.getElementById("minute").innerHTML = m + "分";document.getElementById("second").innerHTML = s + "秒";}setInterval(getTime,1000); //毫秒轉換</script>
</head>
<body><h2 style="color: #00d9ff">杭州亞運會倒計時</h2><span style="color: #cf273d">距離開始還有:</span><span id="day"></span><span id="hour"></span><span id="minute"></span><span id="second">初始化中...</span>
</body>
</html>
題目二:使用Javascript代碼編寫一個手機網頁小游戲,要適合手機屏幕上操作,例如:貪吃蛇、五子棋、連連看等。要包含事件編程的代碼,游戲功能不要設計得太復雜,關鍵是使用自己能理解并掌握的代碼,對自己編寫的代碼有詳細的解釋。
截圖和效果說明:
主要源代碼和說明:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>作業3.2-貪吃蛇</title>
</head>
<body><canvas id="canva" width="400" height="400" style="background:Black"></canvas><script>var line=[42,41]; //貪吃蛇隊列var spot=43; //食物點var fx=1; var n; var ctx=document.getElementById("canva").getContext("2d");function draw(t,c){ctx.fillStyle=c;ctx.fillRect(t%20*20+1,~~(t/20)*20+1,18,18); //給點著色}document.onkeydown=function(e){fx=line[1]-line[0]==(n=[-1,-20,1,20][(e||event).keyCode-37]||fx)?fx:n //獲取鍵盤輸入};!function(){line.unshift(n=line[0]+fx); //頭部增減if(line.indexOf(n,1)>0 || n<0||n>399||fx==1&&n%20==0||fx==-1&&n%20==19) return alert("游戲結束"); //結束條件draw(n,"GREEN");if(n==spot){ //吃到食物while(line.indexOf(spot=~~(Math.random()*400))>=0);draw(spot,"RED");}elsedraw(line.pop(),"Black");setTimeout(arguments.callee,130);}();</script>
</body>
</html>
總結
以上是生活随笔為你收集整理的移动应用开发——作业3的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。