Форум

ufaclub · #1 (**permalink**) 20.04.2018, 19:00

если три значение class (1,2,3)

т.е class1, class2, class3

есть div#krn

как через JQ по кругу менять класс с задержкой в 2 секунды по кругу

т.е

div id="krn" class="class1"
задержка 2 секунды
div id="krn" class="class2"
задержка 2 секунды
div id="krn" class="class3"
задержка 2 секунды

а дальше по кругу

div id="krn" class="class1"
задержка 2 секунды
div id="krn" class="class2"
задержка 2 секунды
div id="krn" class="class3"

рони · #2 (**permalink**) 20.04.2018, 19:37

ufaclub,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div.hot{
      width: 100px;
      height: 100px;
      border: 1px dashed Gray;
      padding: 5px;
      transition: .4s;
  }
  .Red{
      background-color: Red;
  }
  .Green{
      background-color: Green;
  }
  .Yellow{
      background-color: Yellow;
  }
  </style>
</head>

<body>



<div class="hot Red" id="krn"></div>

<script>
(function fn(b, a) {
  document.querySelector("#krn").classList.remove(b[a]);
  a = ++a % b.length;
  document.querySelector("#krn").classList.add(b[a]);
  window.setTimeout(fn, 2000, b, a);
})(["Red", "Green", "Yellow"], 0);
</script>


</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript