Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   7 дивов и анимация (https://javascript.ru/forum/misc/30063-7-divov-i-animaciya.html)

Александр х@к 23.07.2012 00:44

7 дивов и анимация
 
Здравствуйте,
у меня есть 7 дивов, их нужно анимировать.
При нажатии на кнопку Старт появляется див 1, через 1сек появляется второй див, 3 див появляется через 2 сек, див 4 через 3 сек, див пятый и шестой через 3 сек. а на последнем останавливается.
Спасибо.

Deff 23.07.2012 01:13

Цитата:

Сообщение от Александр х@к
Здравствуйте,
у меня есть 7 дивов, их нужно анимировать.
При нажатии на кнопку Старт появляется див 1, через 1сек появляется второй див, 3 див появляется через 2 сек, див 4 через 3 сек, див пятый и шестой через 3 сек. а на последнем останавливается.
Спасибо.

Выложите HTML код
Как оформить тут => http://javascript.ru/formatting

melky 23.07.2012 06:19

Цитата:

Сообщение от Александр х@к (Сообщение 190786)
Здравствуйте,

у меня есть 7 дивов, их нужно анимировать.

Спасибо.

не за что. так каков вопрос?

Dim@ 23.07.2012 10:46

melky,
вопроса нет, просто кто-то должен сделать ему эту анимацию:lol:

devote 23.07.2012 11:06

это он наверно ТЗ для себя запостил... бумага видимо в личном блокноте закончилась :)

melky 23.07.2012 17:02

Цитата:

Сообщение от Dim@
вопроса нет, просто кто-то должен сделать ему эту анимацию

конечно :) я на такие топики уже не стараюсь кодом отвечать.

Dim@ 23.07.2012 17:12

melky,
:lol:
Александр х@к,
вам в раздел Работа

bes 23.07.2012 18:05

http://learn.javascript.ru/settimeout-setinterval

<input type="button" value="start" id="but">
<div id="div">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

<script>
window.onload = function () {
  var but = document.getElementById('but');
  var div = document.getElementById('div');
  var divs = div.children;
  var len = divs.length;
  var i = 0;
  var t = 0;
  var d, now;

  function show() {
    elem = divs[i];
    d = new Date();
    setTimeout(function () {
      now = new Date();
      divs[i].innerHTML = now + '; ' + (now - d) + ' ms'; 
      d = now;
      i++;
      t = t + 1000; 
      if(i == len) {i = 0; t = 0; alert('The End'); return} else {show()}
    }, t)
  }

  but.onclick = function () {
   show()
  }
  
}
</script>

ruslan_mart 25.07.2012 13:27

А если так:
<div class="ololo"></div>
<div class="ololo"></div>
<div class="ololo"></div>
<div class="ololo"></div>
<div class="ololo"></div>


var a = document.getElementsByClassName('ololo')
for(i=0;i<a.length;i++) {
setTimeout (function(){document.getElementsByClassName('ololo')[i].style.display='none';document.getElementsByClassName('ololo')[1].style.display='block';},1000)
setTimeout (function(){document.getElementsByClassName('ololo')[i].style.display='none';document.getElementsByClassName('ololo')[2].style.display='block';},2000)
setTimeout (function(){document.getElementsByClassName('ololo')[i].style.display='none';document.getElementsByClassName('ololo')[3].style.display='block';},3000)
setTimeout (function(){document.getElementsByClassName('ololo')[i].style.display='none';document.getElementsByClassName('ololo')[4].style.display='block';},4000)
setTimeout (function(){document.getElementsByClassName('ololo')[i].style.display='none';document.getElementsByClassName('ololo')[5].style.display='block';},5000)
}


:D

bes 25.07.2012 14:59

Ruslan_xDD, это слишком очевидно :) + много недочётов + не работает
PS: но может быть это и имелось в виду под :D


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