توقف با کلیک روی دکمه های بعدی و قبلی اسلاید شو

[ravand]

سلام من یه اسلاید شو با setInterval نوشتم خیلی ساده است.
این دستورات رو برای دکمه های قبلی و بعدیش بکار بردم:

$(document).ready(function() {
$("#badi").click(function(){
$("img").eq(x).fadeOut("slow");
x =x+1;
$("img").eq(x).fadeIn("slow");

});

$("#ghabli").click(function(){
$("img").eq(x).fadeOut( "slow" );
x =x-1;
$("img").eq(x).fadeIn("slow");

});
});
وقتی روی دکمه ی مثلا بعدی کلیک میکنم. تایمر متوقف نمیشه برای همین تصاویر قاطی میشه. مثلا وقتی تصویر سومی با زدن دکمه ی بعدی می خواد بیاد یهو به خاطر عملکرد متد setInterval یه تصویر دیگه میاد و قاطی میکنه.
نمیشه کاری کرد که متد setInterval هنگام زدن دکمه های قبلی و بعدی متوقف بشه و بعدا که ما دیگه روی دکمه های قبلی و بعدی کلیک نکردیم عمل بکنه و به نمایش تصاویر به صورت خودکار ادامه بده؟
متشکرم.

[Javidhb]

این لینک رو ببینید...

کافیه یه متغیر برای setInterval تعریف کنید و با کلیک روی دکمه ها با استفاده از clearInterval متوقفش کنید.

بهتره از تابع استفاده کنید:

$(document).ready(function() {
$("#badi").click(function(){
stopSlider();

$("img").eq(x).fadeOut("slow");
x =x+1;
$("img").eq(x).fadeIn("slow");
});

$("#ghabli").click(function(){
stopSlider();

$("img").eq(x).fadeOut( "slow" );
x =x-1;
$("img").eq(x).fadeIn("slow");
});
});


function startSlider() {
sliderInterval = setInterval(function () {
//کدهاتون....
}, 5000);
}

function stopSlider() {
clearInterval(sliderInterval);

setTimeout(startSlider, 5000);//شروع مجدد بعد از 5 ثانیه
}