Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Авто смена слайдера (https://javascript.ru/forum/misc/35297-avto-smena-slajjdera.html)

aquapasha 06.02.2013 17:50

Авто смена слайдера
 
Как сделать, чтобы каждые пять секунд чередовались эти 4 функции?
$('#slideshow-nav-1').addClass('active').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide1.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').addClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-2').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide2.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').addClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-3').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide3.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').addClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-4').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide4.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').addClass('active');
  });

tsigel 06.02.2013 18:56

Добавьте функциям имена и вызывайте их одну за другой с помощью setTimeout(funcName, 5000).

Последняя должна вызывать первую.

aquapasha 06.02.2013 20:45

Можно пример рабочего кода, пожалуйста.

nerv_ 06.02.2013 20:51

Цитата:

Сообщение от aquapasha (Сообщение 232023)
$('#slideshow-nav-1').addClass('active').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide1.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').addClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-2').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide2.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').addClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-3').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide3.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').addClass('active'); $('#slideshow-nav-4').removeClass('active');
  });
  $('#slideshow-nav-4').click(function(){
    $('#slideshow-image1').animate({'left':'-1600px'},500,function(){
      $(this).attr('src','../images/slide4.png').css('left','1600px').animate({'left':'100px'},'500');
    });
    $('#slideshow-nav-1').removeClass('active'); $('#slideshow-nav-2').removeClass('active');
    $('#slideshow-nav-3').removeClass('active'); $('#slideshow-nav-4').addClass('active');
  });

вот она, мощь жуквери :D

aquapasha 06.02.2013 20:55

Я в нем вообще не силен, буду благодарен, если вы покажите как надо делать, чтобы понять ошибки свои.

Deff 06.02.2013 21:28

Цитата:

Сообщение от nerv_
вот она, мощь жуквери

Да там чушь имхо - события вешать последовательно на каждый сходный id
c идентичными деяними,
Даж напрягацо не хотца на такой код

Deff 06.02.2013 21:29

Цитата:

Сообщение от aquapasha
, буду благодарен, если вы покажите как

Дайте ссылку на страницу с рабочим(полурабочим) Демо

aquapasha 06.02.2013 21:39

вот

Deff 06.02.2013 21:47

aquapasha,
Есть готовое, ток высоту и оформление кружков подправить
=> http://javascript.ru/forum/jquery/34...tml#post230717


Часовой пояс GMT +3, время: 14:51.