본문 바로가기

슬라이드 이펙트2

[Slide Effect] 슬라이드 이펙트 05 - 이미지 슬라이드(버튼, 닷메뉴) 슬라이드 이펙트 05 : 이미지 슬라이드(버튼, 닷메뉴) 이번 시간에는 그 동안 배웠던 JavaScript를 이용하여 슬라이드 이펙트를 만들어보도록 하겠습니다. 지난번 슬라이드04에서 넣었던 연속적으로 좌우로 움직일 수 있게 하는 버튼에서 닷메뉴(Dot Menu)를 추가시켜 보도록 하겠습니다. HTML 소스 slider__wrap > slider__img > slider__inner 안에 이미지 5장이 들어간 구조이며, 그 아래의 slider__btn div태그 안에 이미지를 좌우로 슬라이드 할 수 있는 버튼을 만들어두었다. 마지막 slider__dot의 경우 안의 a 태그들을 JS로 출력시키기 위해 주석 처리한다. JAVASCRIPT SLIDER EFFECT 05 슬라이드 이펙트 ⑤ - 이미지 슬라이드.. 2022. 10. 14.

[Slide Effect] 슬라이드 이펙트 04 - 좌우 이동 버튼 만들기 슬라이드 이펙트 04 : 좌우 이동 이번 시간에는 그 동안 배웠던 JavaScript를 이용하여 슬라이드 이펙트를 만들어보도록 하겠습니다. 슬라이드를 연속적으로 좌우로 움직일 수 있게 하는 버튼을 추가해보겠습니다. HTML 소스 slider__wrap > slider__img > slider__inner 안에 이미지 5장이 들어간 구조이며, 그 아래의 slider__btn div태그 안에 이미지를 좌우로 슬라이드 할 수 있는 버튼을 만들어두었다. JAVASCRIPT SLIDER EFFECT 04 슬라이드 이펙트 ④ - 좌로 움직이기(연속적으로) 01 02 03 04 05 06 07 prev next CSS 소스 기존의 슬라이드 효과에서 쓰던 CSS 코드에 버튼용(slider__btn) 코드를 추가하였다... 2022. 9. 18.

이전 1 다음

Reference Book

JavaScript

JavaScript

HTML

HTML

CSS

CSS

광고 준비중입니다.

티스토리툴바