:lab
코딩일기
:lab
전체 방문자
오늘
어제
  • 분류 전체보기 (28)
    • 일상 (5)
      • 과학 (0)
      • 개발 (1)
      • Apple (3)
      • 갤럭시 (1)
      • 기타 (0)
    • 실험실 (0)
    • 배운 것들 (17)
      • 블렌더 Blender (0)
      • 깃허브 Github (1)
      • html,css,js (7)
      • python (6)
      • React Native (1)
      • Unity (1)
      • 기타 (1)
    • 블로그 (6)
      • 꾸미기 (4)
      • 수익 (2)

블로그 메뉴

  • 🧇 홈
  • 🏷 태그
  • 🎒 방명록

공지사항

인기 글

태그

  • tenping
  • Random.Range
  • Mac
  • Vendor Prefix
  • 파이썬
  • 깃허브
  • LINK
  • 가상 램
  • tilt.js
  • 왜 됐지
  • 이스터에그
  • 브라우저
  • Python
  • 애드핏
  • pywebview
  • lipsync
  • HTML
  • 10ping
  • 크롬
  • chrome
  • 이게뭐여
  • font family
  • 햄버거메뉴
  • PyAudio
  • react native
  • 광고
  • Prefix
  • h 태그
  • Github
  • alt-c
  • 카카오
  • 수익
  • 맥
  • 구글 클론 사이트
  • Karabiner-Elements
  • 구글
  • 텐핑
  • CSS
  • prefix free
  • Ionicons
  • 티스토리
  • kivy
  • STANDWITHUKRAINE
  • vscode
  • ios
  • RAM Plus
  • 안드로이드
  • 클론 사이트
  • Android
  • 폰트

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
:lab

코딩일기

[Chrome] 구글 크롬 공룡 게임 가지고 놀기 👾
배운 것들/html,css,js

[Chrome] 구글 크롬 공룡 게임 가지고 놀기 👾

2022. 4. 12. 23:42
728x90

크롬을 사용중 인터넷이 연결되지 않았을 때,

🦖

이런 공룡 한마리가 튀어나와 공룡 게임을 즐길 수 있습니다 :)

오늘은 크롬 공룡게임을 가지고 재밌게 놀아볼게요!! 👾😆

 


공룡 게임 실행하기

보통은 공룡 게임을 플레이하기 위해 와이파이를 끄거나 데이터를 끄는 등 기기를 오프라인 상태로 만들지만,

오프라인 상태가 아니어도 이 공룡게임을 플레이할 수 있는 방법이 있습니다!

크롬 주소창에 

chrome://dino

라고 쳐보세요!

그럼 공룡이 우릴 반갑게 맞이해줍니다 :)

이제 실행도 했겠다, 이제 공룡 게임을 커스텀해봅시다


공룡의 스피드 설정하기

우선 개발자 도구를 열어줍니다

맥: option-command-I
윈도우: F12

위의 단축키로 개발자 도구를 열어주시면,

이렇게, 무슨 소린지 모르겠는 외계어가 여러분을 반겨주실겁니다. (html 공부하신 분들은 예외 😉)

이 외계어들은 제쳐두고, 상단의 Console 탭을 눌러줍니다.

Console 클릭!

Console 탭으로 들어가서,

Runner.instance_.setSpeed(원하는 속도);

위와 같이 입력해줍니다. 이 코드는 공룡의 속도를 조절하는 코드입니다.

속도 부분에는 99.9, 0.01과 같이 정수뿐만 아니라 소수까지도 입력이 가능합니다.

 

setSpeed를 0.01로 했을 때는 장애물이 나오지 않아 못 느끼실 수 있지만 사실 움직이고 있습니다 🤣 점수가 엄청 천천히 올라가요 ㅋㅋ

위 영상에서도 보시다시피 명령어를 완전히 외울 필요는 없고 구글에 관련해서 쳐보거나, 아니면 저처럼 runner.instance.setspeed와 같이 간단히 외워놓으면 개발자 도구에서 알아서 추천을 해줍니다. 그 때, 엔터를 눌러주시면 자동완성이 됩니다 :)


공룡세계 중력 설정하기

자, 이제 속도를 바꾸는 법을 알았으니 공룡 세계의 중력을 바꿔봅시다! 😊

중력은 다음과 같은 코드로 바꿀 수 있습니다.

 

 

Runner.instance_.tRex.config.GRAVITY = 원하는 값;

 

보시면 중력의 값을 조절함에 따라 공룡의 점프가 바뀝니다 😲

영상에서 보시는 바와 같이 중력값을 조절함에 따라 

공룡이 뛴! 뛴!

거리다가

슈우우우우우웅

하고 날아갑니다 👍

 

그럼, 이제 비슷하지만 또 다른, 공룡의 점프 능력을 향상시켜볼게요!


공룡이의 점프 능력을 멋지게 만들거나 안 좋게 만들기

자, 이제 글을 쓰다 보니 내적 친밀감이 생긴 우리 공룡이의 점프 능력을 멋지게 해봅시다!

점프는 다음과 같이 조절할 수 있습니다.

 

Runner.instance_.tRex.setJumpVelocity(원하는 값);

 

🦕 연습에 연습을 거듭해 마침내 점프 실력이 좋아진 공룡이.... 🦖

처음엔 공룡이의 점프 실력을 0으로 만들었는데

이상하게.. 약간씩 뛰는거 같습니다... 왜 그런진 잘 모르겠습니다 ㅋㅋ

 

그리고 점점 실력을 높여줬습니다.

이게 처음엔 비슷할 줄 알았는데 그게 아니였어요 ㅋㅋㅋ

약간 느낌이

중력을 조절했을 때는 우주에 있는 느낌이고

점프는 히어로가 착지하는 느낌입니다 ㅋㅋ


죽지않는 공룡이 🦖 🔥🔥

이제, 공룡이를 슈퍼공룡으로 만들어보겠습니다 😲

공룡게임에서 gameOver 함수는 공룡이가 죽게 되는 원인입니다 🥺

그래서 이 gameOver 함수를 빈 함수로 바꿔준다면 공룡이가 죽지 않는것입니다!

이 코드를 쓰면 gameOver 함수가 빈 함수로 대체되어 공룡이가 슈퍼공룡으로 변합니다 :)

 


 

 

게임오버 함수를 되돌리려면 새로고침을 하시면 되지만

새로고침이 싫으시다면 처음에 변수에 gameOver 함수를 저장해두고, 되돌릴때

 

Runner.prototype.gameOver = 변수이름

위처럼 작성해주시면 됩니다!!

무적으로 됐다가 다시 돌아온 모습

 


점수를 조작해봅시다 😎

아니, 이게 어떻게 가능하냐구요? 🧐

가능합니다 😎

 

Runner.instance_.distanceRan = 원하는 점수 / Runner.instance_.distanceMeter.config.COEFFICIENT

이렇게 쳐주시면

점수가 바뀌는 것을 볼 수가 있습니다 :D

 

참고로 공룡게임은 점수가 999999가 최대이므로, 원하는 점수로 999999를 하시면 시작하자마자 0에서부터 시작하는것처럼 보이실 겁니다 😱   (이 점 참고해주세요! 😬)

 

 

점수를 내 마음대로 😎😝

자, 이렇게 점수를 바꿔보는 것까지 했습니다!

생각보다 다양한 방법들로 공룡게임을 커스텀할 수 있었습니다 :)

 

아직 두 가지의 재밌는 방법들이 남았지만 추후 추가 글로 남기겠습니다 😋

다음에 봐요 👋

728x90

'배운 것들 > html,css,js' 카테고리의 다른 글

[JS] tilt.js 사용하기  (0) 2021.02.22
[CSS] -prefix-free 사용하기  (0) 2021.02.14
[CSS] Vendor Prefix란?  (0) 2021.02.14
[html] link의 종류  (0) 2021.02.07
h 태그란? (<h1>, <h2>, <h3>.....)  (0) 2021.02.01
    '배운 것들/html,css,js' 카테고리의 다른 글
    • [JS] tilt.js 사용하기
    • [CSS] -prefix-free 사용하기
    • [CSS] Vendor Prefix란?
    • [html] link의 종류
    :lab
    :lab
    환영합니다! :D

    티스토리툴바