인스타그램 UI 클론 코딩 프로젝트
오늘은 어제 하던 클론 코딩을 이어서 했다. 어제 계획했던 내용부터 살펴보자.
1. 좋아요를 누를 경우 하트가 빨간색으로 변하기는 하는데 빨간색으로 칠해지는 것은 아니다...! 고민해서 해결해보자! 색 반전 시킨다음에 빨간색으로 칠하면 되려나????
2. 사진 피드 게시글 2줄 이상일 경우 줄이기 기능, 더보기 버튼 생성 (현재는 overflow=hidden으로 div를 넘어가는 경우에 안 보이게만 설정해둔 상태이다)
3. 좋아요 누른 사람 수 클릭 시 좋아요 누른 사람들 토글(?)로 띄우는 기능
4. 배경이 너무 심심한데 별똥별 같은거 애니메이션 넣어보고 싶다!
5. 사진 더블 클릭 시 하트가 뿅 떠올랐다가 사라지는 애니메이션도 넣어보고 싶다!
1. 음... 반전 명령어를 써도 이미지가 아니라서 안 먹고 배경색을 바꿔도 안 먹는다...! 더 작은 이모티콘을 넣어서 어떻게든 조정해보려 했으나 그것도 튀어나와버린다..! ㅠㅠ
2. 아직 overflow=hidden으로 설정해둔 상태이다. 게시글 및 댓글 기능을 건들지 않았다.
3. 토글 기능을 추가만 해두었다.
4. 별똥별 애니메이션을 이쁜 걸 찾아서 넣었는데...! 별똥별 하나가 멈춰있다! 내 문제는 아닌듯...? 그래서 그냥 뺐다. 다른 별똥별 애니메이션들은 너무 안 예뻐서....
5. 지금까지 한 내가 만든 애니메이션 중 제일제일 맘에 든다!!!!!!! 퍼온 코드가 아니라서 더 마음이 가는 것 같다 ㅎㅎ
+@: 오른쪽 사이드에 footer를 추가하고 고정시킴, 사진 여러 개 업로드 시 넘기기 기능 추가, 동영상 업로드 기능 추가
footer
여러 장의 사진
동영상
동영상인데 캡쳐라서 사진이 되어버렸다..!