5주차 과제 레포트

수정사항

1. 메뉴 바 디자인을 위해 span 태그였던 메뉴 항목들을 div 태그로 바꾸고 메뉴 항목을 감싸는 부모 div 태그를 하나 더 추가함.

이번주차 내용 적용

1. 아무 기능도 없었던 메뉴 바에 마우스를 가져가면 강조되는 기능을 추가함. 또한 transition을 이용해 부드럽게 강조될 수 있도록 구현하였다.
2. 강아지 사진 역시 마우스를 가져가면 크기가 커지면서 위로 떠오르는 기능을 추가함. transition을 이용해 부드럽게 떠오를 수 있도록 하고, 그림자를 추가해 입체적으로 보이게 구현함.
3. 페이지 이름과 부제목이 각각 왼쪽과 아래에서 서서히 나타날 수 있도록 slide-to-right, slide-to-up이라는 애니메이션을 구현함.
4. 자바 스크립트를 이용해 각 메뉴 버튼이 실제로 작동하게 구현함. 또한 각 메뉴 content가 나왔을 때 마우스를 올리면 글씨가 강조되게 함.