# 슬라이드

12개의 포스트
post-thumbnail

[2022.05.23] 자바스크립트 캐러셀 슬라이드 만들기

그동안 공부한 내용을 바탕으로 직접 이미지 슬라이드를 만들어보기로 했다. 다음/이전 버튼을 누르면 이미지가 슬라이드되는 방식이다.먼저 html 구조는 이렇게 짰다.전체 슬라이드를 감싸서 overflow : hidden을 입힐 slide-container와 flexbox

2022년 5월 23일
·
0개의 댓글
·
post-thumbnail

3월 세미나 슬라이드를 공유합니다

월간 데이터리안 세미나 3월 “데이터 분석가는 어떤 일을 하나요?” 슬라이드를 공유합니다.

2022년 4월 20일
·
0개의 댓글
·

React-slick으로 슬라이드 만들기

일단, npm 혹은 yarn으로 react-slick과 slick-carousel을 설치합니다.혹은(타입스크립트 사용시 @types/react-slick 추가 설치)가장 먼저, 슬라이드 설정을 해줘야 합니다.dot: 슬라이드 밑에 점으로 나타내는 것을 보여주냐 여부 설

2022년 3월 1일
·
0개의 댓글
·
post-thumbnail

이미지를 클릭하면 나오는 팝업 슬라이드(바닐라JS)

포트폴리오에 들어간 슬라이드입니다. * 슬라이드 밑 버튼을 클릭하면 해당 번호의 이미지로 / *이전, 다음 슬라이드로 넘어가는 버튼 / *무한 슬라이드

2022년 1월 4일
·
2개의 댓글
·

슬라이드

2021년 8월 4일
·
0개의 댓글
·
post-thumbnail

[record] React로 slide 기능 구현하기

모든 슬라이드의 기본 동작 원리는 동일하다. 브라우저에 보이는 슬라이드의 큰 틀이 있고 그 내부에 슬라이드의 컨텐츠들이 들어있다. 이때 슬라이드 컨텐츠 전체의 길이는 당연히 한번에 보이는 틀의 길이보다 길어지게 된다. 틀 부분에 css로 overflow: hidden

2021년 7월 11일
·
0개의 댓글
·
post-thumbnail

TIL 23. Carousel(캐로셀)

슬라이드? 캐로셀(Carousel) !

2021년 4월 25일
·
0개의 댓글
·
post-thumbnail

[westargram] react - 이미지 슬라이드 기능1

메인페이지 슬라이드 > 게시글에 사진이 여러장일 경우 화살표가 뜨게 되고 눌렀을 때 자연스럽게 슬라이드가 되도록 만들어야한다! 슬라이드 기능 먼저 이미지를 담고 있는 ul태그의 width 크기를 가져와야한다 어떻게 가져와야할까... 먼저 render()가 완료가

2021년 3월 10일
·
2개의 댓글
·

Vue.js에 slide 적용하기 (Vueper Slides)

시작 및 사용법 모듈 설치 Import > 모듈을 설치하고 임포트를 하면 사용할 준비가 끝납니다. > 사용법은 해당 모듈 사이트에 너무 자세히 나와있어 부가 설명이 불필요할 것으로 판단하여 사이트 주소를 남깁니다. > 공식 사이트: Vueper Slides > >

2019년 12월 18일
·
3개의 댓글
·