Изменения цвета [закрыт]

165

07 декабря 2019, 17:20

Closed. This question needs details or clarity. It is not currently accepting answers.

Want to improve this question? Add details and clarify the problem by editing this post.

Closed 9 месяцев назад.

function randomColor() { 
  function colorNum() { 
    return Math.floor(Math.random() * 256); 
  } 
  setInterval(function() { 
    let elements = document.getElementsByClassName('circle'); 
    for (let i = 0; i <= elements.length; i++) { 
      elements[i].style.background = 'rgb(' + colorNum() + ',' + colorNum() + ',' + colorNum() + ')'; 
    } 
  }, 500) 
}

<div class='element'> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
</div> 
<div class='element'> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
</div> 
<button onclick="randomColor()" id='random'>Click For Random Colors</button>

Answer 1

Про часовую стрелку - не понял.

function randomColor() { 
  function colorNum() { 
    return Math.floor(Math.random() * 256); 
  } 
  let i = 0; 
  let elements = document.getElementsByClassName('circle'); 
  setInterval(function() { 
    elements[i].style.background = 'rgb(' + colorNum() + ',' + colorNum() + ',' + colorNum() + ')'; 
    i = (i + 1) % elements.length; 
  }, 100) 
}

.circle { 
  width:20px; 
  height:20px; 
  border:1px solid black; 
  display:inline-block; 
}

<div class='element'> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
</div> 
<div class='element'> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
  <div class="circle"></div> 
</div> 
<button onclick="randomColor()" id='random'>Click For Random Colors</button>