# slide

33개의 포스트
post-thumbnail

[CSS] CSS 애니메이션으로 상하 무한 슬라이드 구현

외부 라이브러리를 사용하지 않고 상하로 움직이는 무한 슬라이드를 구현슬라이드가 진행하며 동일한 슬라이드가 한 화면에 위와 아래 동시에 보여지는 경우가 있으므로, 슬라이드를 2개씩 생성합니다.

2023년 2월 19일
·
0개의 댓글
·

jquery 슬라이드 ,animate 관련 (중요할듯)

fade in,out 이거 야무짐slide 관련 (slow,fast,시간(1/1000)카테고리 슬라이드 관련 참고코드이미지 슬라이드 관련 참고코드animate 관련

2023년 2월 1일
·
0개의 댓글
·
post-thumbnail

슬라이드를 직접 구현해보았다!

슬라이드를 구현!

2023년 1월 20일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #053일

결과HTMLP 태그에 클래스이름을 정한다. SCSS 반복문을 위해 SCSS 에서 작성한다.script변수 \`\`\`javascriptimageList.css('display','none');imageList.eq(imgIndex).css('display','block

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

Front-end 국비지원 #052일

결과hover를 하게되면 투명도가 있는 배경이 이미지에 십자가모양으로 이펙트를 주게된다.HTMLCSSClass Top , Bottom 의 그림설명top은 넓이가 100%를 차지한다 높이는 50% 영역을 차지하고 하단에 위치한다. (위치가 헷갈릴듯.. 양해바람)botto

2022년 12월 26일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #049일

결과HTMLCSSscript어제 만든 불릿버튼 슬라이드와 코드는 거의 같다. 하지만 다른건 숫자 카운팅인데 크게 다르지 않게 만들었다. ex ) 불릿과 마찬가지로 addClass , removeClass 로 01/05 class=on02/0503/0504/0505/05

2022년 12월 22일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #035일

반응형 페이지 제작 1-1 > 이번 시간에는 제플린을 사용하여 반응형 페이지를 제작한다. 제플린이란? > ### 제플린을 쓰는 이유 이미지 슬라이스 사용이 편리하다. 텍스트 선택시 폰트 정보가 다 나온다. CSS로 나오는데 필요한 부분만 셀렉해서 사용하는 것을

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

slick slide 사용법 개빡친다

slick slide 사용법 개빡친다

2022년 11월 29일
·
0개의 댓글
·
post-thumbnail

카드 자동 슬라이딩 CSS

자동 슬라이딩 카드 HTML css

2022년 11월 15일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #022일

슬라이드 이미지 hover 기능과 버튼 기능 (슬라이드) HTML 구성CSS는 생략...(슬라이드) JavaScript 구성HTML 구성CSS 구성

2022년 11월 14일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #021일

경기도 사이버 도서관메뉴는 생략하고 슬라이드 부분과 검색창을 만든다 (슬라이드) HTML 구성span 태그에는 ir_pm 을 넣어 작성한다..ir_pm {display:block; overflow:hidden; font-size:0; line-height:0; text

2022년 11월 14일
·
2개의 댓글
·
post-thumbnail

[SeSAC Front-end] JS 슬라이드 네비게이션

이번 장에서는 바닐라 자바스크립트로 슬라이드 네비게이션을 구현해 보겠습니다. 버튼을 눌렀을 때 슬라이드가 왼쪽, 오른쪽 이동하도록 만들겠습니다.

2022년 11월 14일
·
0개의 댓글
·

LWC에서 다른 LWC페이지 불러오기

LWC에서 다른 LWC페이지 불러오기/ 오른쪽에서 나오는 화면

2022년 8월 31일
·
0개의 댓글
·
post-thumbnail

[Flutter][Package] carousel_slider (슬라이드 되는 페이지 만들기)

공식문서https://pub.dev/packages/carousel_slider메인 코드파라미터

2022년 8월 17일
·
0개의 댓글
·

라이브러리 없이 Slide 구현하기

이미지 3장을 map으로 돌리기 위해 우선 임의로 bannerList state에 저장을 해둔다.저장한 이미지를 map을 통해 나열해준다.슬라이드 구현은 css의 transform에 translate를 사용할 것이고 inline style 형식으로 작성해준다. (\*

2022년 8월 15일
·
0개의 댓글
·
post-thumbnail

week1-자기소개 페이지 만들기(2)

이전에 올린 페이지의 사진을 클릭해서 링크를 타고 들어오면,위와 같은 페이지로 이동할 수 있다.css에서 Link class에 hover를 주어 마우스를 갖다대면 이미지가 서서히 확대되게 설정했다.다음은, 상단에 있는 ME MBTI등을 클릭하면 해당 위치로 이동하게 된

2022년 7월 29일
·
0개의 댓글
·
post-thumbnail

[카우치코딩] 3주차 진행 회고

3주차 진행 디자인을 전달받고 개발에 들어가게되었다. css를 다시 공부하게 되었다. 슬라이드를 구현하였다.

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