slick 슬라이더 오류문제...
본문
slick 슬라이더를 사용할려고합니다
css/js 지정
<link rel="stylesheet" type="text/css" href="/css/slick.css">
<link rel="stylesheet" type="text/css" href="/css/slick-theme.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript" src="/js/slick.min.js"></script>
html코드
<div class="multiple-items">
<? 테이블에서 값을 조회하는 php ?>
<div class="col-md-4">
<a href="">
<img width="100%" class="img-responsive" src="<?=$src?>">
<h3><?=$title;?></h3>
<p><?=$content;?></p>
</a>
</div>
<?}?>
</div>
오류코드
<script>
$(document).ready(function(){
$('.multiple-items').slick({ <-- 이 부분 .slick에 에러
infinite: true, //양방향 무한 모션
speed:500, // 슬라이드 스피드
autoplay: true, //자동플레이 유무( false시 자동플레이 안됨 )
slidesToShow: 3, //한 화면에 보여줄 아이템수
slidesToScroll: 1, // 한번에 슬라이드 시킬 아이템 개수
arrows: false //좌우 화살 버튼 노출 여부 ( false 시 안보임 )
});
});
</script>
(index):469 Uncaught TypeError: $(...).slick is not a function
at HTMLDocument.<anonymous> ((index):469)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at Function.ready (jquery.min.js:2)
at HTMLDocument.K (jquery.min.js:2)
뭐가 문제인지 모르겠네요... 어떻게 접근해봐야할까요 ㅠㅠ
답변 1
<script>
$(document).ready(function(){
$('.multiple-items').slick({ <-- 이 부분 .slick에 에러
infinite: true, //양방향 무한 모션
speed:500, // 슬라이드 스피드
autoplay: true, //자동플레이 유무( false시 자동플레이 안됨 )
slidesToShow: 3, //한 화면에 보여줄 아이템수
slidesToScroll: 1, // 한번에 슬라이드 시킬 아이템 개수
arrows: false //좌우 화살 버튼 노출 여부 ( false 시 안보임 )
});
});
</script>
이부분의 위치가 어디인지는 모르겠으나 통상 페이지 로딩시 제일 하단에 위치 시켜 보세요....
답변을 작성하시기 전에 로그인 해주세요.
