[Jquery] Bx슬라이더 좌우 버튼을 클릭후 오토슬라이드가 멈출때 방법

Bx 슬라이더의 경우 슬라이드를 자동으로 돌리도록 설정을 해놓은뒤에

직접 좌우 버튼을 눌러서 슬라이드를 조작할경우 자동으로 돌아가는게 멈추고 다시

자동으로 돌아가지 않는 버그같은것이 있습니다.

이부분은 다시 돌아가도록 해줘야 하는데 저는 아래의 방법을 자주사용합니다.

HTML부분

<ul class='mainSl'>

<li><a href=''><img src='/test.jpg' alt=''/></a></li>

<li><a href=''><img src='/test.jpg' alt=''/></a></li>

<li><a href=''><img src='/test.jpg' alt=''/></a></li>

<li><a href=''><img src='/test.jpg' alt=''/></a></li>

</ul>

JS부분

var mainSl = $(".mainSl").bxSlider({

auto:true,

controls:true,

onSlideAfter: function($slideElement, oldIndex, newIndex){

mainSl.startAuto();

}

});

기본적으로 bx슬라이더를 돌릴때 변수를 하나 선언해서 그 변수에 넣어줍니다.

그리고 나서 onSlideArter 함수를 이용하여 슬라이드가 돌아간뒤에 다시 오토스타트를 

넣어서 다시 돌아가게끔 매번 설정을 해주는것이죠.

이런식으로 해결하면 슬라이드를 좌우버튼을 클릭을 해서 멈추어도 다시 일정시간뒤에

다시 자동으로 돌아가게 됩니다. ^^