# swiper

69개의 포스트

[Error Report] Swiper와 v-for 동시 적용 시, 배열의 첫 번째 요소만 출력되는 문제 (watch, computed 활용 로그 분석)

vuejs는 데이터 변경이 감지되면 자동으로 뷰를 다시 렌더링하여 변경 사항 반영함.<li> v-for 적용 시 변수에 할당된 배열의 요소중 첫번째 요소에만 할당되는 현상 확인swiper 라이브러리와 동시에 사용한 것이 문제일까? 확인 예정..데이터 변경과 화면에

6일 전
·
0개의 댓글
·

JS Swiper 슬라이더 옵션 ✨

swiper 라는게 있네? 예전에 일일히 이미지 슬라이더를 만들던 나.............. 이 젠 안 녕 swiper를 사용하면 쉽게 슬라이드를 만들 수 있다! CDN 방식으로 사용할 수 있다. swiper를 보통 이미지 슬라이더로 많이 사용하던데, CSS로 예쁘게 만들면 화면 상단 탭(카테고리)로도 사용이 가능 하다는 점을 알았다~! 기본 구조는...

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

swiper 여러가지

https://open-code.tech/en/post-728/

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

Swiper

슬라이드 기능을 쉽게 만들 수 있도록 한 스크립트사이트 : https://swiperjs.com/1) 링크 가져오기이 링크가 있어야 스와이퍼가 작동된다.2) 마크업mySwiper 이름은 내 마음대로 설정 가능,나머지 swiper, swiper-rapper, s

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

swiper loop 옵션 선택 시 마지막 페이지 부터 시작되는 현상

Swiper onInit 이 아닌 fetching 함수의 onComplete에서 swiper.slideTo(1) 를 사용한다

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

Swiper 이 녀석

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

react Swiper custom renderBullet

Swiper는 slide 또는 carousel 을 표현하는 UI 라이브러리이다https://www.npmjs.com/package/swiperreact에서 swiper로 custom pagination 버튼을 만들고 싶은 경우공식 문서 예제는 아래와 같이 st

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

Javascript - Swiper

Swiper는 슬라이드를 사용할 수 있게 해주는 자바스크립트 라이브러리이다. 웹사이트 대부분이 이 효과를 사용하여 슬라이드 기능을 넣어준다.

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

yarn berry 에서 swiper9.0 사용시 에러

yarn berry & pnp 설명https://medium.com/wantedjobs/yarn-berry-%EC%A0%81%EC%9A%A9%EA%B8%B0-2-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%A0%81%EC%9A%A9

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

AMORE MALL

📚 Overview 사이트명: 아모레몰 작업 기간: 7일 소요 라이브러리: swiper, jquery 유형: 모바일 적응형, 클론 코딩 특징: fetch 함수와 비동기 처리를 통해 호출한 데이터 사용 사이트 ✔️ What's the point? fetch() 함수로

2023년 1월 18일
·
0개의 댓글
·

jQuery - swiper 웹접근성 준수

출처 : https://pxd-fed-blog.web.app/a11y-swiper-slide/앞서 swiper option 정리하면서 a11y 의 사용법을 잘 모르겠어서 검색해서 찾은 내용나는 단순하게 이전/다음 슬라이드 정도의 내용을 넣는 정도만 생각했는데

2023년 1월 11일
·
0개의 댓글
·

jQuery - swiper option

direction: "vertical", // 슬라이드 방향slidesPerView: 3, // 한 화면에 보일 슬라이드 수slidesPerView: "auto", // 한 화면에 보일 슬라이드를 자동으로 계산spaceBetween: 30, // 슬라이드 사이 간격c

2023년 1월 10일
·
0개의 댓글
·

jQuery - swiper menu

!codepenpowerwmj/embed/dyjvWZK?default-tab=html%2Cresult

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

[Native] react-native-swiper

native에서 제공하는 swiper 기능이다.설치간단 사용예시!swiper 하고자 하는 목록을 swiper 태그로 감싼다.방향에 따라서 width, height 가 지정되어 있지 않으면 전체사이즈를 타겟 잡기 때문에swiper 할 목록의 사이즈를 지정해 주어야 동작한

2023년 1월 4일
·
0개의 댓글
·

Swiper 사용법

📋 Swiper swiper는 슬라이드 라이브러리로 다양한 메소드와 설정을 지원해서 사용하기 매우 편하다. 그리고 하위 브라우저(IE9)에서도 동작하기 때문에 크로스 브라우징 측면에서도 뛰어나다. 1.Swiper 라이브러리 연결 제일 먼저 라이브러리를 사용하기 위해

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

Front-end 국비지원 #038일

반응형 페이지 제작 1-4 > 결과 >HTML >모바일 슬라이드 섹션부분은 'swiper'에서 가져왔다. 반응형페이지 이므로 모바일 사이즈로 줄어들면 보이는 슬라이드 영역이다. 기존의 슬라이드는 diplay: none; 이 된다. > CSS > Script

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

[React] 카드 슬라이더 만들기(1)

저번 주와 마찬가지로 javascript로 만들어진 카드 슬라이더를 리액트로 클론해보는 연습을 했다. 참고 https://wsss.tistory.com/1582Swiper API https://swiperjs.com/react우선 Swiper라는 라

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

마이리얼프로젝트(JSP)

해당 JSP 프로젝트는 Spring 프로젝트를 위해서 JSP를 숙지하기 위한 프로젝트이다. 해당 프로젝트는 가볍게 진행할 예정이다. 가볍게 진행하는 이유 : 요즘에는 JSP를 안쓴다고도 하고 제가 취업을 원하는 곳은 Spring boot로 취업을 원했기 때문이다. S

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

올리브영

🛠 올리브영 사이트명 : 올리브영 제작기간 : 22.10.19 ~ 22.10.21 (3일 소요) 사용언어 : html, css 라이브러리 : jQuery, swiper 분류 : 모바일형, 클론코딩 📌 Review!! 1. 스와이퍼 패럴럭스효과 및 텍스트효과 🔎

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

원티드

🛠 Wanted 사이트명 : 원티드 제작기간 : 22.10.26 ~ 22.10.27 (2일 소요) 사용언어 : html, css 라이브러리 : jQuery, swiper 분류 : 반응형 📌 Review!! 1. 미디어쿼리 적용하기 🔎 코드분석 반응형은 항상

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