에휴... 일단 옵션은 찾아보면 정리해두신 거 많으니 스킵하고.
우선 사용하려면 css랑 js 연결해줘야됨.
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
이거 두 개부터 연결해줘요
css 수정법이 AG-Grid 랑 비슷함;; 자기가 원하는 css 부분이 어디인지 개발자도구 (F12) 로 포인트 찍어서 읽어오고, css 파일 하나 만들어서 수정해줘야 됨
이런식임
개골치아파 아앙아으ㅏ으아으ㅏ으ㅏㅇ으 ㅂㄷㅂㄷㅂㄷㅂㄷㅂㄷㅂㄷㅂㄷ
참아 메가응애...!
난 못참아!!!!!!!
아무튼. 그다음엔 js 파일 하나 만들어서 원하는 옵션 정의해주면 됨.
$('#subMenu2').slick({
slide: 'li', // 슬라이드할 태그
infinite: true, // 무한 슬라이드 여부
slidesToShow: 5, // 한 화면에 보여줄 갯수
slidesToScroll: 5, // 한 번 클릭할 때 돌아갈 갯수
prevArrow : $(".left"),
nextArrow : $(".right"),
variableWidth : true, // 요소 넓이 자동 조정 여부 (true : 조정 안 함 / false : 자동 조정)
draggable: false, // 드래그 가능 여부
});
난 이렇게 했는데
혹시 slick 고수님 계시면 알려줘요
slick 두 번 못 써요?
그럼 여러 곳에 쓰려면 어떻게 해야 되나요
<ul class="topMenu">
<li>요일별</li>
</ul>
<ul id="subMenu1" class="subMenu">
<div class="btn left"></div>
<li><a href="#" >월</a></li>
<li><a href="#" >화</a></li>
<li><a href="#" >수</a></li>
<li><a href="#" >목</a></li>
<li><a href="#" >금</a></li>
<div class="btn right"></div>
</ul>
지금 이런식으로 되어 있는데 subMenu 클래스 거니까 안돼 ㅠ
그렇다고 subMenu1 아이디로 여러 개 걸려니까 그것도 안 돼 ㅠ
중복사용 어케하는지 아시는 고수님 알려줘유
젭알제방ㄹ.......!!!!