Форум

#1 (**permalink**) 15.08.2008, 15:52

У меня возникла проблема с отображением имиджа по таймеру в Firefox, но в ie все хорошо, т.е. имиджи, которые я определил в массиве отображаются с периодом 1 сек. Подскажите где кроется ошибка, а может быть лучше сделать по другому?
Скрипт (поиск DIV класса present и замена поля background):
Код:

<script language="JavaScript" type="text/javascript">
      i=0;
      img_a=new Array()
                                                
      img_a[0]="url(image/back.jpg) no-repeat scroll 100% 100%;"                        
                                                               
      img_a[1]="url(image/back_2.jpg) no-repeat scroll 100% 100%;"                        
function img_b()
{
    var coll = document.getElementsByTagName("Div");
   for(var j=0; j<coll.length; j++)
    {
      if(coll[j].className == "present")
        {
           coll[j].style.background=img_a[i];
       }
    }    
    i++   
 if(i>1) {
        i=0;
 }
 setTimeout("img_b()", 1000)
}
</script>

CSS стиль
Код:

.present {   
   height: 240px;
   width: 100%;   
   background: url(image/back.jpg) no-repeat scroll 100% 100%;
}

HTML
Код:

<body onLoad=img_b()>
<div class="present"></div>

ZoNT · #2 (**permalink**) 15.08.2008, 16:40

i=0;
img_a=["url(image/back.jpg) no-repeat scroll 100% 100%;","url(image/back_2.jpg) no-repeat scroll 100% 100%;"]

function img_b() {
	var coll = document.getElementsByTagName("Div");
	for(var j=0,l=coll.length; j<l; j++){
		if(coll[j].className == "present") {
			coll[j].style.background=img_a[i];
			break; // незачем перебирать дальше, если уже нашли...
		}
	}
	i=1-i;

	setTimeout(arguments.callee, 1000);
}

а что хоть за проблема в ФФ?

#3 (**permalink**) 15.08.2008, 16:52

Цель скрипта, показ через указанный таймаут разных имиджей, т.е. сначала идидж1, потом имидж2 и т.д..
В ие скрипт работает и имиджи меняются по таймеру, а в фф отображается имидж1 и никакого изменения

#4 (**permalink**) 15.08.2008, 17:11

Надо сказать, что и подправленный Вами скрипт в фф также не отображает имиджи

ZoNT · #5 (**permalink**) 15.08.2008, 17:22

ну так я ничего и не исправлял, я просто переписал получше

проверил - скрипт работает, картинка меняется

Андрей Параничев · #6 (**permalink**) 15.08.2008, 17:25

Попробуйте менять только свойство backgroundImage, у меня работает:

<html>
<head>
	<style>
		.b {
			height: 240px;
			width: 100%;   
			background: url(back1.jpg) no-repeat scroll 100% 100%;
		}
	</style>
	<script>
		function cycleImages() {
			var i = 1;
			var element = document.getElementById("cycleBackground");
			setInterval(function() {
				if(i >= 4) i = 1;
				element.style.backgroundImage = "url(back"+ (i++) +".jpg)";
			}, 1000);
		}
	</script>
</head>
<body onload="cycleImages()">
	<div id="cycleBackground" class="b">
		&nbsp;
	</div>
</body>
</html>

Код только для проверки с тремя картинками back1.jpg, back2.jpg, back3.jpg.
Я думаю по аналогии легко переделать под вашу задачу.

ZoNT · #7 (**permalink**) 15.08.2008, 17:27

<body onload="img_b()"> попробуй

Сообщение от Андрей Параничев

Попробуйте менять только свойство backgroundImage, у меня работает:

У меня и так работает прекрасно...

#8 (**permalink**) 15.08.2008, 17:49

Попробовал через Id, все получилось.
Но, возникла маленькая мелочь:
При загрузке страницы отображается имидж, который мы определили в стиле (если не определили пустота), т.е. имидж1, потом задержка больше чем определено в скрипте (1 секунда) и отображение имиджа2 и т.д..
Чем вызвана задержка?

Андрей Параничев · #9 (**permalink**) 15.08.2008, 17:51

Потому что у вас скрипт первый раз устанавливает то изображение, которое уже установлено стилем.

#10 (**permalink**) 15.08.2008, 17:55

Да нет, я установил на следующее значение, т.е. в скрипте первый имидж2.
Но задержка есть, на глаз 1 секунда

Форум

Справочник

Discord чат

Курсы javascript