───────────────────────────────────
1.질문 분야 : (ex : XE)
2.질문하기 전에 검색해본 내용 : ( ex : XE에서 ***를 검색했는데 관련 내용이 없고 찾을 수 없어ㅠㅠ)
3.질문 내용 : (질문내용을 자세하게 적어주세요. html/css/js 코딩 관련 질문은 소스 첨부 필수!)
───────────────────────────────────
1. 질문분야 : 제이쿼리 owlCarousel 슬라이더 적용
2. 검색하는 방법을 잘 모르겠기도 하고, 검색했을때 나오는 내용을 다 적용이 잘 된 것들이 나와서
내가 어디를 잘못해서 안되는 것인지ㅜㅜ 도무지 모르겠어
3. html 파일을 첨부할게
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>Title</title>
<link href="js/OwlCarousel/dist/assets/owl.carousel.css">
<link href="js/OwlCarousel/dist/assets/owl.theme.default.css">
<script src="js/jquery-3.3.1.js"></script>
<script src="js/OwlCarousel/dist/owl.carousel.js"></script>
<style type="text/css">
*{margin:0; padding: 0; }
.box{height: 100px; background-color:antiquewhite; text-align: center; margin: 10px; }
</style>
</head>
<body>
<div class="slide owl-theme">
<div class="box"> 내용1 </div>
<div class="box"> 내용2 </div>
<div class="box"> 내용3 </div>
<div class="box"> 내용4 </div>
<div class="box"> 내용5 </div>
<div class="box"> 내용6 </div>
<div class="box"> 내용7 </div>
</div>
</body>
<script>
$(document).ready(function(){
$('.slide').owlCarousel({
});
});
</script>
</html>
내가 만들려는 부분에서 적용이 안되서 따로 테스트용으로 만들었어!
예전에 코딩수업할때, 그냥 저렇게 넣기만 해도 기본적인 구조로는 슬라이드 적용이 되었던 것 같은데,
왜 그냥 세로로만 정렬이 되는건지 도무지 모르겠어ㅠㅠ
파일 경로나 등등은 다 맞궁!
전에 코딩 수업때 제대로 작동했던 것도 지금 다시 보니 세로로만 쭈르륵 나오네ㅠㅠ
제이쿼리 초보자는 웁니다...
* 물어볼 곳이 없어서 혹시 아는 토리가 있을까 해서 처음 글쓴는거라,
질문 내용이 잘못되었거나 문제 있으면 둥글게 지적해주라...ㅜㅜ
캐러셀에 적용되야하는 기본 css가 아예 없어서 그런거같은데?
플러그인 사이트에서 기본 예제 보면 css 적용된거 긁어서 붙여넣어봐
<link href="js/OwlCarousel/dist/assets/owl.carousel.css">
<link href="js/OwlCarousel/dist/assets/owl.theme.default.css">
그리고 혹시 요거 경로 제대로 되어있는거 맞아?