본문 바로가기

슬라이드효과1

[EFFCET] 이미지 : 슬라이드 유형03 이미지 슬라이드 : 연속적으로 움직이기 지난 시간에는 슬라이드가 좌측으로 이동하는 타입으로 마지막에서 슈루룩~ 첫번째로 돌아갔다면 이번 시간에는 이미지가 자연스럽게 넘어가도록 2초 지날 때마다 이미지가 연속적으로 바뀌는 슬라이드 형식의 페이지를 작업해보겠습니다.😀 #1. HTML / CSS 설정하기 ! HTML TIP ! 각 이미지마다 css설정을 주기 위해 따로 부모를 2번 감싸서 묶어줍니다. ✏️ HTML 스크립트 보기 ! CSS TIP ! 1. 이미지를 가로로 연결하기 위해 포지션을 relative로 설정하고 영역에서 벗어나는 이미지를 안보이게 처리하기 위해 overflow: hidden을 설정해줍니다. 2. 이미지가 연속적으로 움직일 수 있도록 첫번째 이미지를 6번째에 추가로 넣습니다. (애니메이.. 2022. 9. 2.

이전 1 다음

728x90

Lucky Charms Rainbow

JAVASCRIPT

html

HTML

css

CSS

티스토리툴바