-5

let milsec = 0;
let seconds = 0;
let minutes = 0;
let hours = 0;
let displaySeconds = 0;
let displayMinutes = 0;
let displayHours = 0;
let interval = null;
let status = "stopped";
let start = document.getElementById("startStop");
function stopWatch() {
  milsec++;
  if (milsec / 10 === 1) {
    milsec = 0;
    seconds++;
    if (seconds / 60 === 1) {
      seconds = 0;
      minutes++;
      if (minutes / 60 === 1) {
        minutes = 0;
        hours++;
      }
    }
  }
  if (milsec < 10) {
    displayMilsec = milsec.toString();
  }
  if (seconds < 10) {
    displaySeconds = "0" + seconds.toString();
  } else {
    displaySeconds = seconds;
  }
  if (minutes < 10) {
    displayMinutes = "0" + minutes.toString();
  } else {
    displayMinutes = minutes;
  }
  if (hours < 10) {
    displayHours = "0" + hours.toString();
  } else {
    displayHours = hours;
  }
  document.getElementById("display").innerHTML = displayHours + ":" + displayMinutes + ":" + displaySeconds;
}
function startStop() {
    if (status === "stopped") {
    interval = window.setInterval(stopWatch, 100);     
   document.getElementById("startStop").innerHTML = "Stop";   
   document.getElementById("startStop").style.background = '#fca903';   
   status = "started";
  } else {
      window.clearInterval(interval);
    document.getElementById("startStop").innerHTML = "Start";     
    document.getElementById("startStop").style.background = '#4beb23'; 
    document.getElementById("startStop").style = '#40c71e';
    status = "stopped";
  }
}
.a1 {
  background: #4beb23;
  cursor: pointer;
}
.a1:hover {
background: #40c71e;
}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Stopwatch</title>
  <script type="text/javascript" src="script.js"></script>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="container">
    <div id="display">
      00:00:00
    </div>
    <div class="buttons">
      <button type="b1" class="a1" id="startStop" onclick="startStop()">Start</button>
    </div>
  </div>
</body>
</html>

5
  • Это ваш собственный код?
    – EzioMercer
    26 июн 2022 в 14:23
  • в js функция stopWatch не вся моя
    – F Games
    26 июн 2022 в 14:30
  • А CSS весь ваш?
    – EzioMercer
    26 июн 2022 в 14:33
  • да.............
    – F Games
    26 июн 2022 в 14:34
  • Тогда не понятно, что вам мешает поменять цвет, при наведении
    – EzioMercer
    26 июн 2022 в 14:34

1 ответ 1

0
.a1 {
    background: #4beb23;
    cursor: pointer;
}
.a1:hover {
    background: yellow;
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.