Добавление таймаута в ротацию JavaScript

Question

Добавление таймаута в ротацию JavaScript

У меня работает следующий код (только в Firefox и Safari - не беспокойтесь, это тонкий эффект, который не требует идеальной кросс-браузерной совместимости).

HTML

<span id="rotate_star"></div>

Javscript

<script>
    var count = 0;
    function rotate() {
      var elem2 = document.getElementById('rotate_star');
      elem2.style.MozTransform = 'rotate('+count+'deg)';
      elem2.style.WebkitTransform = 'rotate('+count+'deg)';
      if (count==360) { count = 0 }
      count+=10;
      window.setTimeout(rotate, 30);
    }
    window.setTimeout(rotate, 100);
</script>

Я буду честен, я не самый сообразительный человек в мире, когда дело доходит до JavaScript. Я хочу, чтобы эта анимация повторялась в бесконечном цикле, но я хочу, чтобы она задерживалась на 5 секунд каждый раз, когда она совершает полный поворот на 360 градусов.

Кто-нибудь может помочь?

javascript,jquery,

0

Ответов: 1

JavaScript, JQuery,

Похожие вопросы

score 1 · Accepted Answer

1 принят

Вам просто нужно немного его изменить, и он должен делать то, что вы хотите. Попробуй это:

<script>
    var count = 0;
    function rotate() {
      var elem2 = document.getElementById('rotate_star');
      elem2.style.MozTransform = 'rotate('+count+'deg)';
      elem2.style.WebkitTransform = 'rotate('+count+'deg)';
      if (count==360) { 
          count = 10;
          window.setTimeout(rotate, 5000);
      } else {
          count += 10;
          window.setTimeout(rotate, 30);
      }
    }
    window.setTimeout(rotate, 100);
</script>