유리쯔의일상 2023. 12. 28. 00:40
반응형

 

 

 김춘장이의 위키백과 - 나만의 공부 기록 Tistory ❤ 

 

 


 

 

 

응급상황

오늘 오후 과제 제출인데 

팀장님이 개인사로 탈주 😥

어쩔 수 없이 남은 둘이서 마저 진행을 해야 하는 데 

다른 팀원도 아직 구현중이고 바빴다.

그래서 먼저 끝낸 내가 어찌어찌 메인 화면을 구현하고 연결하는 것 까지 진행하기로 하였다

너무 급하게 하던 프로젝트라 너무 허접해 보일 까봐 

첫 화면에 큰 기능이 없더라도 특이해 보이게 하고싶었다.

그래서 유튜브를 뒤져보다 카드효과에 대한 정보를 얻고 그대로 구현해 봤다

 

 

 

 

 

구현

 

 

CSS와 Javascript로 이런 효과를 내다니 ! 

너무 이쁘지 않는가 !

유튜버 애플코딩 님의 영상을 보고 바로 따라했다

다만 나는 카드가 2개라 조금은 수정도 했다 👻

 

 

포켓몬카드 링크 : https://poke-holo.simey.me

 

Pokémon Cards CSS Holographic Effect

An exploration of what's possible with CSS for Pokemon Cards, simeydotme (Simon Goellner)

poke-holo.simey.me

애클코딩님 링크 : https://youtu.be/YDCCauu4lIk?si=oMZYmOayLkhVdujY

 

 

 

👏 나의 소스코드 👏

 

index.html
0.00MB
index.js
0.00MB
style.css
0.00MB

반응형