[KiTaeZa]

Попробовал сделать слайдер своими руками, так как надо было запихать в него немного специфики. В принципе все получилось, но осталась одна проблема.
Когда сайт открыт и ты находишься на нем все замечательно. Но стоит перейти на другую вкладку и там пробыть какое то время, за которое слайдер сделает цикл и вернутся обратно на сайт, как слайдер начинает вываливать на тебя всю пропущенную тобой анимацию. выглядит это не очень приятно и мыслей как от этого избавится честно говоря никаких.
ХТМЛ и JS данного чуда я привожу ниже. эту конструкцию в действии можно посмотреть тут.
С удовольствие выслушаю мысли по поводу моей проблемы и вообще того что я натворил в данной конструкции.

function sliders(){
		setTimeout("chenge_image()",time_interval);
		setTimeout("chenge_image()",time_interval*2);
	}

	function chenge_image_block(){
		menu_slider.css('background','url(/images/up_top_bg.jpg) repeat-x left top');
		menu_slider = menu_slider.next()
		menu_slider.css('background','url(/images/up_top_bg_hv.jpg) repeat-x left top');
	    main_slider.fadeOut();
		main_slider = main_slider.next();
		setTimeout("main_slider.fadeIn()", 420);
	    if(s == 3 && i == 1){
	    	sliders();
	    	menu_slider.css('background','url(/images/up_top_bg.jpg) repeat-x left top');
	    	menu_slider = $(".top_menu_index li:first");
	    	menu_slider.css('background','url(/images/up_top_bg_hv.jpg) repeat-x left top');
	    }
	    if(s == 2){
	    	activ_image = $('.slide_image:first');
	    	$('.slide_image').css('display','none');
	    	$('.slide_image:first').css('display','block');
	    	i = 1;
	    }
	    if(s == 3){
	    	main_slider = $('.slider_index_page:first');
	    	s = 0;
	    }
	     s++;
	}



	$(document).ready(function(){
        activ_image = $('.slide_image:first');
        main_slider = $('.slider_index_page:first');
        menu_slider = $(".top_menu_index li:first");
        temp_hover = '';

        time_interval = 3500;
        time_slaide = 12000;
        i=1;
        s=1;
        pause_cheker = true;

        sliders();

        intervalID = setInterval("chenge_image_block()",time_slaide);

 		menu_slider.css('background','url(/images/up_top_bg_hv.jpg) repeat-x left top');

		$(".top_menu_index li").hover(function(){
												temp_hover = $(this).css('background');
												$(this).css('background','url(/images/up_top_bg_hv.jpg) repeat-x left top')
											},
											function(){
												$(this).css('background', temp_hover)
											}
		);

		$(".top_menu_index li").click(function(){

            $('.slide_image').css('display','none');
			//включение нужной кнопки
			$(".top_menu_index li").css('background','url(/images/up_top_bg.jpg) repeat-x left top');

			$(this).css('background','url(/images/up_top_bg_hv.jpg) repeat-x left top');
			temp_hover = 'url(/images/up_top_bg_hv.jpg) repeat-x left top';

			//сбор и новый старт счетчика
			clearInterval(intervalID);
			if(pause_cheker){
				pause_cheker = false;

				setTimeout(function(){
									intervalID = setInterval("chenge_image_block()",time_slaide);
									pause_cheker = true;
									}, 10000);
            }
			//замена головного блока

			$(".slider_index_page").fadeOut();


			button_id = $(this).attr('id');

			if(button_id == 'pervii'){
				setTimeout("$('#first').fadeIn()", 420);
				$('.slide_image:first').css('display','block');
				sliders();
			}
			else if(button_id == 'vtoroi'){
				setTimeout("$('#second').fadeIn()", 420);

			}
			else if(button_id == 'tretii'){
				setTimeout("$('#thirst').fadeIn()", 420);
			}

		});


	});

<div id="image_block">
                          	<ul class="top_menu_index">
                          		<li id="pervii" style="background: url(&quot;/images/up_top_bg.jpg&quot;) repeat-x scroll left top transparent;">ISO сертификация</li>
                          		<li id="vtoroi" style="background: url(&quot;/images/up_top_bg_hv.jpg&quot;) repeat-x scroll left top transparent;">CPO сертификаты</li>
                          		<li id="tretii" style="background: url(&quot;/images/up_top_bg.jpg&quot;) repeat-x scroll left top transparent;">Строительные товары</li>
                          	</ul>
                              <div class="clear"></div>
                              <div id="first" class="slider_index_page" style="display: none;">
                           	<div id="text_image">
                           		<p>1 text.</p>
                           		<a href=""><div id="button_image">Узнать больше</div></a>
                           	</div>
                               <img src="/assets/images/iso14001.jpg" class="slide_image" style="display: none;">
                               <img src="/assets/images/ohsas.jpg" style="display: none;" class="slide_image">
                               <img src="/assets/images/iso9001.jpg" style="" class="slide_image">
                               <div class="clear"></div>
                              </div>
                              <div style="display: block;" id="second" class="slider_index_page">
                           	<div id="text_image">
                           		<p>2 text.</p>
                           		<a href=""><div id="button_image">Узнать больше</div></a>
                           	</div>
                               <img src="/assets/images/sro.jpg">
                               <div class="clear"></div>
                              </div>
                              <div style="display: none;" id="thirst" class="slider_index_page">
                           	<div id="text_image">
                           		<p>3 text.</p>
                           		<a href=""><div id="button_image">Узнать больше</div></a>
                           	</div>
                               <img src="/assets/images/stroy.jpg">
                               <div class="clear"></div>
                              </div>

</div>