사용전 자바스크립트를 불러오고 + fullpage스크립트를 불러온다 html의 구조는 다음과 같이 id 선택자 형태로 되어 있는걸 볼 수 있다 Some section Some section Some section Some section 첫번째 구역이나 구역의 첫번째 슬라이드 이외에 다른 곳을 출발점으로 정의하고 싶다면 처음 불러오시려는 구역과 슬라이드에 active 클래스를 추가 Some section 슬라이드를 추가하고 싶을 때 다음과 같이 html을 쓸 수 있다 Slide 1 Slide 2 Slide 3 Slide 4 초기 설정 > 자바스크립트 > 제이쿼리 셋팅 $(document).ready(function() { $('#fullpage').fullpage({ //options here autoSc..
swiperjs(스와이퍼js) 슬라이더 오늘은 기존에 사용하던 owl carousel(아울캐러샐) 대신 swiper(스와이퍼)를 사용 해봤습니다. 요즘에 꽤 좋다고 평가되는 플러그인이기에 사용방법도 익힐겸 공부를 해봤습니다. 저는 아직 기본적인 부분만 사용을 해봤기 때문에 일단은 "많은 부분이 다르다" 이렇게 말씀 드리긴 어려울 것 같지만, 그래도 몇가지 차이점을 바로 알 수 있었습니다. 첫번째로 다양한 데모 버전을 지원한다는 것입니다 swiper > demos(기본 지원 버전) owl carousel > demos(기본 지원 버전) 딱봐도 큰차이가 느껴지는 것 같습니다. 물론 owl carousel(아울캐러샐)로도 수정을 통해 다양한 작업이 가능 하지만( API 옵션 적용 등) 저는 그 부분이 어렵게 ..
- Total
- Today
- Yesterday
- 피그마(figma) 로컬 폰트 적용
- 피그마
- 웹
- 디자인툴
- 플렉스 반응형
- 플렉서블 박스(flexible-box)
- 프로토타입
- 레이아웃 정렬
- 피그마(figma)
- 플렉스 반응형 그리드
- 플렉스 박스(flex box)
- 피그마(figma) 폰트 적용
- UI디자인
- figma
- 플렉스 박스(flex-box)
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |