🤍 전 강의 25% 할인 중 🤍

2024년 상반기를 돌아보고 하반기에도 함께 성장해요!
인프런이 준비한 25% 할인 받으러 가기 >>

  • 카테고리

    질문 & 답변
  • 세부 분야

    자격증 (디자인)

  • 해결 여부

    해결됨

페이드 슬라이드 관련 문의

20.12.01 16:23 작성 조회수 228

3

선생님 안녕하세요^^

세로 2컬럼 최종본 제작영상 관련 질문이 있습니다. 

페이드 슬라이드  부분에서

강의영상에는

.slide > div a에 opacity : 0 값을 주고

키프레임 0%일때 visibility : hidden으로 지정하였는데요.

최종본 소스 다운로드 자료에는

.slide > div a에 visibility : hidden값을 주고

키프레임에

5%, 40% 구간에 visibility값을 visible과 hidden으로 다시 지정하셨던데

혹시 어떠한 차이가 있는건가요? 

답변 1

답변을 작성해보세요.

1

visibility : hidden 을 주지 않으면 이미지가 안보이지만 겹쳐 있기 때문에 3번째 a 태그만 클릭됩니다.

보이는건 완벽하게 크로스페이드가 되지만 위처럼 해주셔야 완벽한 크로스페이드 슬라이드 제작이됩니다.

섹션 7. 모듈 제작하기(슬라이드 애니메이션 - CSS 제작 방식, 제이쿼리 제작 방식)에 보시면 5. CSS 슬라이드 애니메이션(크로스페이드 슬라이드) 영상에 더 보기로 CSS 버전 크로스페이드 슬라이드 CSS 구문 오류 수정 내용이 있습니다. 영상을 찍을 때 미쳐 넣지 못한 부분을 첨부했습니다.

채널톡 아이콘