동일한 페이지 내에서 복수의 OwlCarousel의 설정을 달리하는 방법

동일한 페이지 내에서 복수의 OwlCarousel의 설정을 달리해야 하는 경우에 

다음과 같은 방법으로 하시면 됩니다 ^^

우선 내용을 넣을 HTML에서 각 div 태그마다 id를 다르게 설정합니다.

[예시]
<div id="owl-one" class="owl-carousel owl-theme"> 
<div id="owl-two" class="owl-carousel owl-theme"> 
<div id="owl-three" class="owl-carousel owl-theme">

그리고 설정을 넣을 script에서 위 id대로 셀렉트 해주면 됩니다.

[예시]
$('#owl-one').owlCarousel({    
$('#owl-two').owlCarousel({    
$('#owl-three').owlCarousel({

저도 잠시 삽질을 했는데요 ㅠㅠ

첫 번째 carousel은 id를 지정하지 않고 그대로 두고 두 번째 carousel부터 id를 지정했더니 

첫 번째 carousel의 설정이 두 번째에 그대로 반영되더군요 ㅠㅠ

각각의 carousel의 id를 달리 지정해니 비로소 제대로 작동하네요.

그리고 아래 참고 페이지에 class 명만 달리 하는 방법이 소개되어 있던데요.

id를 지정하는 방법이 더욱 확실하게 잘 작동하는 것 같네요 ^-^

참고: https://github.com/OwlCarousel2/OwlCarousel2/issues/1906