Programming/Web
마작 점수계산기 만들기 - 4
he1fire
2020. 9. 25. 02:39
728x90
일단 저번에 가장 중요한 부분들은 구현을 얼추 했으니
이제부터는 좀 부가적인 기능을 만들기로 했다.
내 목표는 아무것도 없이 마작 패만 있을 때도
웹사이트만 켜면 다른 모든 것을 할 수 있는 것이었기 때문에
가장 먼저 떠오른 주사위를 굴리는 기능을 만들기로 했다.
처음에는 이미지를 가져와서 쓸까 하다가
그냥 그리드 그리는 법을 연습하는 셈 치고
손수 도트를 찍어서 주사위 모양을 만들었다.
굴리기 버튼을 눌렀을 때 바로 주사위가 나오니 너무 밋밋해서
setInterval함수를 사용해 주사위가 여러 번 나오는 모션을 만들었다.
주사위를 만들고 나니까 점수가 바뀔 때에도 모션이
있으면 좋겠다는 생각을 해서 만들기 시작했다.
여기에서도 똑같이 setInterval함수를 사용해서
점수가 변할 때 한 번에 바뀌지 않고 부드럽게 변하도록 바꾸었다.
▶▶▶ 구경하러가기 ◀◀◀
728x90