본문 바로가기
반응형

slider6

슬라이드 이펙트 : 화살표 버튼, 닷(dot) 메뉴 슬라이드 이펙트 : 화살표 버튼, 닷(dot) 메뉴 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect06 슬라이드 이펙트 : 이미지 슬라이드(버튼, 닷 메뉴) 1 2 3 4 5 6 prev next 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. 이전과 다르게 화살표 버튼과 .. 2023. 4. 13.
슬라이드 이펙트 : 위로 연속으로 움직이기 슬라이드 이펙트 : 위로 연속으로 움직이기 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect05 슬라이드 이펙트 : 위로 움직이기(연속적으로) 1 2 3 4 5 6 dongjin6539@naver.com 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. 첫번째 이미지를 다섯번째.. 2023. 4. 12.
슬라이드 이펙트 : 좌로 연속으로 움직이기 슬라이드 이펙트 : 좌로 연속으로 움직이기 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect04 슬라이드 이펙트 : 좌로 움직이기(연속적으로) 1 2 3 4 5 6 dongjin6539@naver.com 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. 첫번째 이미지를 다섯번째.. 2023. 4. 11.
슬라이드 이펙트 : 하 → 상 움직이기 슬라이드 이펙트 : 하 → 상 움직이기 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect03 슬라이드 이펙트 : 위로 움직이기 1 2 3 4 5 6 dongjin6539@naver.com 코드 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. 두번째 슬라이드 이펙트와 다르게 w.. 2023. 4. 10.
슬라이드 이펙트 : 우 → 좌 움직이기 슬라이드 이펙트 : 우 → 좌 움직이기 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect02 슬라이드 이펙트 : 좌로 움직이기 1 2 3 4 5 6 dongjin6539@naver.com 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. 첫번째 슬라이드 이펙트와 다르게 widt.. 2023. 4. 10.
슬라이드 이펙트 : 트랜지션 효과 슬라이드 이펙트 : 트랜지션 효과 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2) / 완성화면 코드 블럭 Javascript slider Effect01 슬라이드 이펙트 1 2 3 4 5 6 dongjin6539@naver.com 구성 코드는 간단하게 header 구역 부분에 제목 태그, 목록 태그를 사용해서 텍스트를 입력해줍니다. main 구역에는 이미지 태그를 사용해 각각 이미지를 입력해줍니다. css는 유형별로 공통으로 사용될 스타일은 파일로 따로 만들어서 링크 태그를 사용해 가지고 와서 입력해주고 유형별로 다르게 사용될 스타일은 각각의 코드 구성하는데 입력해줍니다. style 구역으로 이동해서 첫번째 이미지, 두번째 이미지, 세.. 2023. 4. 10.
반응형