0
"url 해시 버튼"에 "selected"클래스를 추가하려고합니다. 원래 데모에서Owl Carousel 2 베타, URL 해시 탐색에서 "selected"클래스 추가
봐 : http://www.owlcarousel.owlgraphic.com/demos/urlhashnav.html
나는 <a class="button secondary url" href="#zero">zero</a>가 클릭 할 때 <a class="button secondary url selected" href="#zero">zero</a>로 변경, 또는 아이템 자동 재생 그것을, 또는 드래그/슬쩍 항목 것이라고합니다.
HTML :
<div id="owl-appt" class="owl-carousel">
<div class="item one" data-hash="one"><img src="img/gallery/home/appt1/1.jpg" alt=""></div>
<div class="item two" data-hash="two"><img src="img/gallery/home/appt1/2.jpg" alt=""></div>
<div class="item three" data-hash="three"><img src="img/gallery/home/appt1/3.jpg" alt=""></div>
</div>
<a class="url one" href="#one"><img src="img/gallery/home/appt1/s1.jpg" /></a>
<a class="url two" href="#two"><img src="img/gallery/home/appt1/s2.jpg" /></a>
<a class="url three" href="#three"><img src="img/gallery/home/appt1/s3.jpg" /></a>
JS :
$("#owl-appt").owlCarousel(
{
items : 1,
autoplay:false,
animateOut: 'fadeOut',
loop:false,
responsive: true,
callbacks: true,
URLhashListener:true,
startPosition: '#one',
});
if($("#owl-appt .item.one").parent().is(".active")){
$("a.url.one").addClass("selected");
}else{
$("a.url.one").removeClass("selected");
};