어코디언(Accordion) 2가지 방법 & 모달(Modal) 띄우는 4가지 방법

어코디언(Accordion) 2가지 방법 & 모달(Modal) 띄우는 4가지 방법

안녕하세요. 코딩웍스입니다.

실무에서 어코디언(Accordion) 2가지 방법 & 모달(Modal)을 만들어야 하는 경우가 필수적으로 생깁니다.
이런 경우 어코디언과 모달을 만들 때 제이쿼리 플러그인을 사용하는건 좀...

어떤 형태이건 최소한 한 가지 방법은 스스로 코딩해서 보여주어야 합니다.

어코디언을 만드는 2가지 방법과 모달을 띄우는 4가지 방법을 한번쯤 해보시면 좋습니다.
학습 난이도는 그리 높지 않으니 충분히 해보실 수 있습니다.

⚡ 강의 영상은 유튜브에서 보실 수 있고, 코딩웍스 인프런 강의 HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1) 섹션 8. 회사에서 바로 써먹는~ 퍼블리싱 실전 예제 만들기에서도 보실 수 있습니다.(완성본 파일은 인프런  강의에서 다운로드 하실 수 있습니다. )

🌍 HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1) 강의에서 보러가기

 

어코디언(Accordion) 만드는 2가지 방법

1) 넷플릭스(Netflix) FAQ 어코디언 실전 예제 만들기
https://youtu.be/oY-Nuay0SBQ

2) 밀리의 서재 자주 묻는 질문들(FAQ) 어코디언 실전 예제 만들기
https://youtu.be/4PpO1cKTtOw

모달을 띄우는 4가지 방법

1) 모달(Modal) 만들기 #01(제이쿼리 페이드인아웃 모달)
https://youtu.be/CZfOq-7XmE0

2) 모달(Modal) 만들기 #02(제이쿼리 애니메이션 모달)
https://youtu.be/yhqlqqP9RN0

3) 모달(Modal) 만들기 #03(바닐라 자바스크립트 애니메이션 모달)
https://youtu.be/u1UtOZflOfI

4) 모달(Modal) 만들기 #04(Only CSS 애니메이션 모달) :target 가상클래스
https://youtu.be/9dpRqvPL82E

댓글을 작성해보세요.