[Javascript, css] 랜덤 주사위 굴리기

Blue_parr0t 일상

admin write link

스터디 일지/기획과 시행착오

2019. 11. 22. 16:08

이전 포스트 참고 :

원래는 '돌려돌려 돌림판 v2.0 - 사기 룰렛' 을 기획하려고 했다.

KonvaJS 를 설치하고 진행하려고 했는데, 이 방대한 소스를 이해 안하고 그대로 가져다 쓰기가 좀.. 그렇다. ( 내 양심이 )

그래서 KonvaJS 를 우선 서서히 습득하고, 학습 도중이지만 KonvaJS로 완성도 있는 페이지를 만들고 싶은 욕심이 생겼다.

그리고나서 '도신의 주사위'를 기획하려고 했으나, 주사위를 굴리는 모션이 생각보다 내맘대로 안돌아간다.

(트랜지션 말고 애니메이션을 걸어줘야되나..)

좀 더 생각해봐야겠다.

이런식으로 굴리면 되려나..

이후 애니메이션을 적용하고 아래와 같이 만들었다.

주사위 모양 특수문자가 있어서 넣어봤더니 생각보다 이쁘진 않았다.

(⚀ ⚁ ⚂ ⚃ ⚄ ⚅ , ⠂⠌⠸⠭⁙⠿ 등)

약간 부자연스럽지만 이정도면 다음 vuejs 토이 플젝으로 가능할 듯.

tag : dice, JavaScript, 랜덤, 주사위

[ 1 ] [ ··· ] [ 5 ] [ 6 ] [ 7 ] [ 8 ] [ 9 ] [ 10 ] [ 11 ] [ 12 ] [ 13 ] [ ··· ] [ 147 ]