0805-SliderGoGo

Intro

슬라이드 5 NextStep

/woowa/main

  • 베스트 반찬 아래 아래와 같은 ‘밑반찬’ UI를 만든다.
  • 밑반찬은 ‘베스트반찬’과 같은 넓이 크기를 가지며, 좌우 슬라이딩 효과로 동작한다.
  • 좌/우버튼(2번)을 누르면 애니메이션이 되면서 좌/우로 화면이 이동되며 새로운 메뉴 4개가 노출된다. 메뉴 갯수가 4의 배수로 떨어지지 않을때는 4칸씩 이동하는 방식에서 예를들어 1칸씩 이동으로 동작될 수 있어야 한다.
  • 동그란 메뉴에(1번) 마우스를 올리면 새벽배송/전국택배라는 글자를 노출한다. 동시에 배경에 있는 이미지는 검은색으로 처리되어 글자가 더 잘 보이도록 한다.

개인적인 고려 사항 기존의 Slide에 재사용성을 생각해본다.

  • 베스트 반찬 아래 아래와 같은 ‘밑반찬’ UI를 만든다.
  1. data ajax를 가지고 오기 [O]
  2. 기존 template에서 조금 변형한 형태의 template만들기 [v] -> tab card랑 리팩토링 같이 쓰는 template 수정 필요 한지 중첩해서 할 수 있는 부분 최대한 같이 쓸 수 있게 수정
  3. template(data)로 렌더링 [O]
  4. 이벤트 클릭시 transition 걸기

요구사항 분석