龜屁賽跑副本 | 程式專案

{"id":79032,"student_id":1990,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\\t\u003ctitle\u003e龜屁賽跑\u003c/title\u003e\\n\\t\\t\u003cscript\\n  src=\\\"https://code.jquery.com/jquery-3.4.1.slim.min.js\\\"\\n  integrity=\\\"sha256-pasqAKBDmFT4eHoN2ndd6lN370kFiGUFyTiUHWhU7k8=\\\"\\n  crossorigin=\\\"anonymous\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n    \u003ch1\u003e龜兔賽跑\u003c/h1\u003e\\n    \u003cdiv id=\\\"result\\\"\u003e究竟誰能勝出呢？\u003c/div\u003e\\n    預測能力：\u003cdiv id=\\\"score\\\"\u003e0\u003c/div\u003e\\n    \u003cbutton class=\\\"btn turtle-btn\\\"\u003e🐢 烏龜會獲勝\u003c/button\u003e\\n    \u003cbutton class=\\\"btn rabbit-btn\\\"\u003e🐇 屁孩會獲勝\u003c/button\u003e\\n    \u003chr\u003e\\n    \u003cdiv id=\\\"turtle\\\"\u003e🐢\u003c/div\u003e\\n    \u003cbr\u003e\\n    \u003cdiv id=\\\"rabbit\\\"\u003e🐇\u003c/div\u003e\\n    \u003cbr\u003e\\n    \u003chr\u003e\\n    \u003cbutton class=\\\"full-btn reset-btn\\\"\u003e繼續下一場\u003c/button\u003e\\n    \\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"*{\\r\\n  font-size:30px;\\r\\n  font-family:Microsoft JhengHei;\\r\\n}\\r\\n\\r\\n#turtle{\\r\\n  position:absolute;\\r\\n  left:95%;\\r\\n}\\r\\n\\r\\n#rabbit{\\r\\n  position:absolute;\\r\\n  left:95%;\\r\\n}\\r\\n\\r\\n.btn{\\r\\n  display:inline-block;\\r\\n  border-radius:10px;\\r\\n  width:49%;\\r\\n}\\r\\n\\r\\n.full-btn{\\r\\n  display:inline-block;\\r\\n  border-radius:10px;\\r\\n  width:100%;\\r\\n}\\r\\n\\r\\n#result{\\r\\n  background:\\t#fff8d9;\\r\\n  padding:10px;\\r\\n  display:inline-block;\\r\\n  border-radius:20px;\\r\\n  width:50%;\\r\\n}\\r\\n\\r\\n#score{\\r\\n  background:\\t#fff8d9;\\r\\n  padding:10px;\\r\\n  display:inline-block;\\r\\n  border-radius:20px;\\r\\n  width:5%;\\r\\n  margin-bottom:10px;\\r\\n}\\r\\n\\r\\n.selected{\\r\\n  border:2px solid red;\\r\\n}\\r\\n\\r\\n.reset-btn{\\r\\n  display:none;\\r\\n  background:skyblue;\\r\\n}\",\"js\":\"var turtleStep;\\r\\nvar rabbitStep;\\r\\nvar score=0;\\r\\n\\r\\n$(\\\".reset-btn\\\").click(function(){\\r\\n    rabbitStep=95;\\r\\n    turtleStep=95;\\r\\n    // $(\\\"#turtle\\\").css(\\\"left\\\",turtleStep+\\\"%\\\");\\r\\n    // $(\\\"#rabbit\\\").css(\\\"left\\\",rabbitStep+\\\"%\\\");\\r\\n    // $(\\\".btn\\\").attr(\\\"disabled\\\",false);\\r\\n    // $(\\\".btn\\\").removeClass(\\\"selected\\\");\\r\\n    // $(\\\".reset-btn\\\").hide();\\r\\n    // $(\\\"#result\\\").html(\\\"究竟誰能勝出呢？\\\");\\r\\n});\\r\\n\\r\\n$(\\\".turtle-btn\\\").click(function(){\\r\\n    bet(\\\"turtle\\\")\\r\\n});\\r\\n\\r\\n$(\\\".rabbit-btn\\\").click(function(){\\r\\n  bet(\\\"rabbit\\\")\\r\\n});\\r\\n\\r\\nfunction bet(decision){\\r\\n\\r\\n  //增加選擇框\\r\\n  if (decision == \\\"rabbit\\\") {\\r\\n      $(\\\".rabbit-btn\\\").addClass(\\\"selected\\\")\\r\\n  }else{\\r\\n      $(\\\".turtle-btn\\\").addClass(\\\"selected\\\")\\r\\n  }\\r\\n  $(\\\".turtle-btn\\\").attr(\\\"disabled\\\",true)\\r\\n  $(\\\".rabbit-btn\\\").attr(\\\"disabled\\\",true)\\r\\n  \\r\\n  rabbitStep=95;\\r\\n  turtleStep=95;\\r\\n var gameStart = setInterval(function(){\\r\\n    rabbitStep-=Math.random()*5\\r\\n    turtleStep-=Math.random()*5\\r\\n    $(\\\"#turtle\\\").css(\\\"left\\\",turtleStep+\\\"%\\\");\\r\\n    $(\\\"#rabbit\\\").css(\\\"left\\\",rabbitStep+\\\"%\\\");\\r\\n    \\r\\n    \\r\\n    if (rabbitStep\u003c=0 || turtleStep\u003c=0) {\\r\\n        clearInterval(gameStart)\\r\\n        if (rabbitStep\u003c=0) {\\r\\n            if (decision==\\\"rabbit\\\") {\\r\\n                score++\\r\\n        } else {\\r\\n            \\r\\n            score--\\r\\n        }\\r\\n            }\\r\\n            }else{\\r\\n                if (decision==\\\"turtle\\\"){\\r\\n            if (turtleStep\u003c=0) {\\r\\n            \\r\\n            score++\\r\\n        } else {\\r\\n            \\r\\n            score--\\r\\n        }}\\r\\n        \\r\\n    }\\r\\n    \\r\\n    $(\\\"#score\\\").text(score)\\r\\n    $(\\\".reset-btn\\\").show()\\r\\n  },100);\\r\\n}\"}","created_at":"2019-07-13T11:26:52.603+08:00","updated_at":"2019-11-05T02:01:58.847+08:00","name":"龜屁賽跑 副本","language":"web","screenshot":{"url":"https://cdn8.koding.school/uploads/project/screenshot/79032/05a1ebf6f41bf17da61ec27247849d28.jpg"},"parent_id":79022,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":104,"hashid":"yeys234m","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}