Как совместить setTimeout и цикл for?
Здравствуйте, уважаемые форумчане! Есть div, который должен менять фон через каждую секунду. Теперь нужно, используя цикл for при каждом прохождении цикла сделать задержку каждого цвета на одну секунду с помощью setTimeout.
Дело в том, что цикл for выдает только последнее прохождение и не хочет задерживаться на каждом цвете. Поискал ответ в интернете, пришел к такому написанию скрипта:
<div style="width:300px; height:300px; background-color:red;" id="col"></div>
<script type="text/javascript">
var color = ["green", "blue", "red", "orange"];
var el = document.getElementById('col');
var max = color.length-1;
for(var i=0; i<=max; i++) {
(function(i){
setTimeout(function(){
el.style.background = color[i];
}, 1000);
})(i);
}
</script>
Но он тоже почему-то не работает. Подскажите, пожалуйста, как все-таки в моем скрипте совместить for и setTimeout.
|