Остановка/ возобновление анимации фона
 

Имеется плавная смена картинки фона сайта. Но при определенных обстоятельствах она отвлекает (всплывает скрытый DIV с фото галереей). Очень хочется ее временно остановить, например запустив функцию, а после также успешно восстановить. Остановить ее получается, а вот запустить обратно без перезагрузки страницы - не выходит. Подскажите плз. что можно сделать?

var aImages = new Array();

	var iPrev = -1;
	var iRnd = -1;

	
	aImages[0] = "images/1.jpg";
	aImages[1] = "images/2.jpg";
	aImages[2] = "images/3.jpg";
	aImages[3] = "images/4.jpg";
	aImages[4] = "images/5.jpg";
	aImages[5] = "images/6.jpg";
	aImages[6] = "images/7.jpg";	
	


	
	 $(document).ready(function() {
		
		$("img#bg").load(function()

			{
				$("img#bg").fadeTo(2000,1);
				
				
		    	setTimeout(function() 
				
			    	{
			    		$("img#bg").fadeOut(2000);
						
			    		setTimeout(LoadImages,2500);
						
						
			    	}
			    	,5000);
			}			
		)
	
		
		setTimeout(LoadImages,1000);
    });

	   function LoadImage(iNr)
		{
	
		    $("img#bg").attr("src", aImages[iNr]);
		
  		 };

    function LoadImages()
    {
     	/* Select a random image number and make sure this is not equal to the previous image */
    	while(iPrev == iRnd)
    	{
    		iRnd = Math.floor(Math.random()*aImages.length);
    	}
     	/* Show the selected image */
    	LoadImage(iRnd);
    	iPrev = iRnd;

     };

НТМL:

<img   src="" alt="background" id="bg" style="display:none" />

CSS

san256,
1.Вариант классический: При запуске фотогалереи под нее подсовываем полупрозрачный тёмный фон скрывающий все отвлекающие факторы
2. Не увидел Ваших попыток останова - поэтому неясно что править

Спасибо за ответ:)

По-первому варианту, такая идея меня посещала - это на случай того, если остановить с последующим успешным возобновлением не выйдет.

По-второму, попытки не считаются удавшимися, если анимация в принципе не возобновляется. :lol:

Выложите неудачную - посколь нужно откуда то плясать

работает, но не знаю, совсем не изящно на мой взгляд, в этом деле я новичок, но по другому не смог придумать, как подменить переменные при загрузке изображения, при котором условие не может быть выполнено, в итоге анимация не останавливается, а просто нечего "анимировать". На страничке имеется две кнопочки. Одна вызывает функцию openGal (), другая соответственно функцию closedGal().

var iRnd = -1;

 <!-- off galery-->
function closedGal() {
iRnd = 0;
	$('.example').fadeOut(800);
$('#content').fadeIn(800).css({display:'block'});
LoadImages();
st();
};
	
 <!-- on galery-->

function openGal () {
$('.example').fadeIn(800);
$('#content').css({display:'none'});
iRnd = 0.5;


};     
 

<!--анимация фона-->
var aImages = new Array();

	var iPrev = -1;
	

	
	aImages[0] = "images/1.jpg";
	aImages[1] = "images/2.jpg";
	aImages[2] = "images/3.jpg";
	aImages[3] = "images/4.jpg";
	aImages[4] = "images/5.jpg";
	aImages[5] = "images/6.jpg";
	aImages[6] = "images/7.jpg";	
	




	 $(document).ready(function st() {
		
		$("img#bg").load(function()

			{
				$("img#bg").fadeTo(2000,1);
			
				
				
		    	setTimeout(function() 
				
			    	{
			    		$("img#bg").fadeOut(2000);
						
			    		setTimeout(LoadImages,2500);
						
						
			    	}
			    	,5000);
			}			
		)
	
	
		setTimeout(LoadImages,1000);
    });


	   function LoadImage(iNr)
		{
	
		    $("img#bg").attr("src", aImages[iNr]);
		
  		 };


    function LoadImages()
    {
     	/* Select a random image number and make sure this is not equal to the previous image */
    	while(iPrev == iRnd)
    	{
    		iRnd = Math.floor(Math.random()*aImages.length);
    	}
     	/* Show the selected image */
    	LoadImage(iRnd);
    	iPrev = iRnd;
		
     };

san256,
Так - Пойдёт ?

<!--анимация фона-->
var aImages = new Array();

	var iPrev = -1;
	

	
	aImages[0] = "images/1.jpg";
	aImages[1] = "images/2.jpg";
	aImages[2] = "images/3.jpg";
	aImages[3] = "images/4.jpg";
	aImages[4] = "images/5.jpg";
	aImages[5] = "images/6.jpg";
	aImages[6] = "images/7.jpg";	
	


	var TimmmerID;

	 $(document).ready(function st() {
		
		$("img#bg").load(function()

			{
				$("img#bg").fadeTo(2000,1);
			
				
				
		    	TimmmerID=setTimeout(function() 
				
			    	{
			    		$("img#bg").fadeOut(2000);
						
			    		setTimeout(LoadImages,2500);
						
						
			    	}
			    	,5000);
			}			
		)
	
	
		setTimeout(LoadImages,1000);
    });


	   function LoadImage(iNr)
		{
	
		    $("img#bg").attr("src", aImages[iNr]);
		
  		 };


    function LoadImages()
    {
     	/* Select a random image number and make sure this is not equal to the previous image */
    	while(iPrev == iRnd)
    	{
    		iRnd = Math.floor(Math.random()*aImages.length);
    	}
     	/* Show the selected image */
    	LoadImage(iRnd);
    	iPrev = iRnd;
		
     };

 <!-- on galery-->
function openGal () {
  clearTimeout(TimmmerID);
};   
 <!-- off galery-->
function closedGal() {
  $("img#bg").load();
};

отлично! Работает. Вот только иногда глючит... не пойму из-за чего Спасибо )

вопрос новичка
 

одного не пойму, каким образом функция load(function(){}) постоянно повторяется? Она по идее, нигде сама себя не вызывает... :blink:

$("img#bg").load() - инициализирует событие принудительно