нужна помощь jquery - создание автоматического слайд-шоу - PullRequest
Новая
       0

нужна помощь jquery - создание автоматического слайд-шоу

0 голосов
/ 02 сентября 2011

У меня есть некоторый код, который генерирует кнопки prev / next и будет циклически проходить по группе изображений, используя две функции nextPhoto и prevPhoto.Мне было интересно, может ли кто-нибудь помочь мне превратить этот код в автоматическое слайд-шоу?

Вот мой код: 

$max = 8;
$current = 1
function nextPhoto() {
  if ($current != $max) {
    $('.slider'+($current)+'').hide();
    $('.slider'+($current+1)+'').show();
    $('.slider'+($current+1)+'').css('left', '20%');
    $('.slider'+($current+1)+'').animate({left:'0%'}, {duration:500, easing:"easeOutExpo", queue:false});
    resizeImages();
    $current++;
  }
  if ($current == 2) {
    $('#background .left').animate({left:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
  }
  if ($current == $max) {
    $('#background .right').animate({right:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
    setInterval("restartSlider()", 5000);
  }
}   
function prevPhoto() {
  resizeImages();
  if ($current != 1) {
    $('.slider'+($current)+'').hide();
    $('.slider'+($current-1)+'').show();
    $('.slider'+($current-1)+'').css('left', '-20%');
    $('.slider'+($current-1)+'').animate({left:'0%'}, {duration:500, easing:"easeOutExpo", queue:false});
    resizeImages();
    $current --;
  }
  if ($current == 1) {
    $('#background .left').animate({left:'-85px'}, {duration:600, easing:"easeOutExpo", queue:false});
  }
  if ($current == $max-1) {
    $('#background .right').animate({right:'0px'}, {duration:600, easing:"easeOutExpo", queue:false});
  }
}

$('.right').mouseup(function(){
  nextPhoto();
})
$('.left').mouseup(function(){
  prevPhoto();
})

Ответы [ 2 ]

1 голос
/ 02 сентября 2011

Если ваши методы nextPhoto () и prevPhoto () работают, я бы просто установил интервал для таймера. 

var delay = 5000; //5 seconds
var timer = window.setInterval('nextPhoto()', delay);

и остановить его 

clearInterval(timer);
1 голос
/ 02 сентября 2011

Я бы предложил вам использовать уже доступный и широко используемый плагин для этого jQuery цикл вместо того, чтобы писать его самостоятельно.Взгляните на это, он предлагает множество функций.Я уверен, что это обязательно поможет вам.

...