Skip to content
Advertisement

Why clearInterval() is not working in timer Js?

I am training to work with js and one of the projects was a pomodoro timer. The timer works well from the main panel and stops and switches between tabs. But if you click on the clock button in the header and select any of the options there, then the timer does not stop and is not cleared when switching tabs, and plus when it ends, it goes into minus.

timerInt = setInterval(timerF, 1000);
  function timerF() {
    if (sec === 0) {
      sec = 59;
      min--;
    } else {
      sec--;
    }
    if (sec < 10) {
      timeSec.textContent = `0${sec}`;
    } else {
      timeSec.textContent = `${sec}`;
    }
    if (min < 10) {
      timeMin.textContent = `0${min}`;
    } else {
      timeMin.textContent = `${min}`;
    }
    if (sec <= 0 && min <= 0) {
      clearInterval(timerInt);
      timeSec.textContent = `00`;
      timeMin.textContent = `00`;
    }
  }

Here is the code that is executed when the first option is selected (20 min):

time1.addEventListener("click", function () {
  clearInterval(timerInt);
  timeChoose = 20;
  setTimes.classList.remove("active-time");
  startBtn.removeAttribute("disabled", "disabled");
  pomo.classList.add("active");
  longBreak.classList.remove("active");
  shortBreak.classList.remove("active");
  startBtn.classList.add("active-btn");
  timeSec.textContent = `00`;
  timeMin.textContent = `20`;
  startBtn.addEventListener("click", function () {
    timer(timeChoose);
    startBtn.setAttribute("disabled", "disabled");
  });
});

Link to an example page to make it easier to understand what I’m talking about and see the code. Please help me to make the timer work well after selection https://createchaoslab.github.io/pomo/

Advertisement

Answer

You calss Timer. But there is no timer function. Try this.

EDITED:

var tabs = document.querySelectorAll(".tab");
const first = document.querySelector(".first");
const timeMin = document.querySelector(".time-min");
const timeSec = document.querySelector(".time-sec");
var startBtn = document.querySelector(".start-btn");
const time1 = document.querySelector(".time1");
const time2 = document.querySelector(".time2");
const time3 = document.querySelector(".time3");
const setTimes = document.querySelector(".set-times");
const setTimesBtn = document.querySelector(".set-time img");
let timerInt;
let timeChoose=2;

function timer(timeChoose = 10) {
  let sec = 0;
  let min = timeChoose;
  timerInt = setInterval(timerF, 1000);
  function timerF() {
    if (sec == 0) {
      sec = 59;
      min--;
    } else {
      sec--;
    }

    if (sec < 10) {
      timeSec.innerHTML = `0${sec}`;
    } else {
      timeSec.innerHTML = `${sec}`;
    }
    if (min < 10) {
      timeMin.innerHTML = `0${min}`;
    } else {
      timeMin.innerHTML = `${min}`;
    }
    if (sec <= 0 && min <= 0) {
      clearInterval(timerInt);
      timeSec.innerHTML = `00`;
      timeMin.innerHTML = `00`;
    }
  }
}



tabs.forEach(tab => {
  tab.addEventListener('click', function handleClick(event) {
      clearInterval(timerInt);
    [].forEach.call(tabs, function(el) {
            el.classList.remove("active");
    });

    this.classList.add("active");
    if(this.classList.contains('first')){
      timeSec.innerHTML = `00`;
          if (timeChoose < 10) {
                timeMin.innerHTML = `0${timeChoose}`;
              } else {
                timeMin.innerHTML = `${timeChoose}`;
              }
            startBtn.classList.add("active-btn");
      startBtn.removeAttribute("disabled", "disabled");
    }
    else{
        if(this.classList.contains('second')){
          timeSec.innerHTML = `00`;
          timeMin.innerHTML = `01`;
          timer(1);
        }
        else{
          timeSec.innerHTML = `00`;
          timeMin.innerHTML = `04`;   
          timer(4);
        }
                startBtn.classList.remove("active-btn");
    }
  });
});

function setT(min) {
  clearInterval(timerInt);

  timeChoose = min;
    [].forEach.call(tabs, function(el) {
            el.classList.remove("active");
    });
    setTimes.classList.remove("active-time");
  startBtn.removeAttribute("disabled", "disabled");
      first.classList.add("active");
  startBtn.classList.add("active-btn");
  timeSec.innerHTML = `00`;
  timeMin.innerHTML = `${timeChoose}`;
}

time1.addEventListener("click", function () {
    setT(20);
});
 
time2.addEventListener("click", function () {
    setT(40);
});
time3.addEventListener("click", function () {
    setT(60);
});


startBtn.addEventListener("click", function () {
  timer(timeChoose);
  startBtn.setAttribute("disabled", "disabled");
});
setTimesBtn.addEventListener("click", function () {
  setTimes.classList.toggle("active-time");
});
body{
  background: rgb(221, 99, 0);
}

.header {
    border-bottom: 2px solid #fff;
    margin-bottom: 70px;
}

.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.set-time {
    display: flex;

}

.set-time img {
    margin-left: 20px;
  width: 40px;
  height: 40px;
    cursor: pointer;
    padding: 0 10px;
}

.set-times {
    visibility: hidden;
}

.set-times>* {
    display: none;
}

.set-times.active-time>* {
    display: block;
}

.set-times.active-time {
    visibility: visible;
    background: #ff8100;
    display: flex;
    padding: 10px 30px;
    border-radius: 20px;
    transition: all.4s;
    -webkit-transition: all.4s;
    -moz-transition: all.4s;
    -ms-transition: all.4s;
    -o-transition: all.4s;
}

.time-var {
    padding: 0px 10px;
    font-size: 20px;
    color: #fff;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    letter-spacing: 1px;
    cursor: pointer;
}

.time-var:hover {
    background-color: #f5812e;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;

}

.time-var+.time-var {
    margin-left: 15px;
}

.tabs{
  display:block;
  position:relative;
  width: 100%;
  height: 40px;
  padding: 10px;
}
.tab{
  display: inline-block;
  text-align: center;
  width: 60px;
  transition: all .3s;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  padding: 7px 10px;
  margin: 0 10px;
  cursor: pointer;
  background-color: transparent;
  border: transparent;
  outline: none;
  -webkit-transition: all .3s;
}
.tab.active{
  background:rgb(168, 60, 18);
}
#text {
    display: flex;
    color: #fff;
    justify-content: center;
    align-items: center;
}

.start-btn.active-btn {
    margin-top: 10px;
    border-radius: 5px;
    background-color: rgb(255, 230, 210);
    color: rgb(221, 99, 0);
    font-size: 15px;
    border: transparent;
    outline: none;
    padding: 10px 20px;
    cursor: pointer;
    visibility: visible;
}
.start-btn {
    visibility: hidden;
}
<body>
    <header class="header">
      <div class="container">
        <div class="header-inner">
          <div class="set-time">
                        <div class="set-times">
                            <div class="time-var time1">20 min</div>
                            <div class="time-var time2">40 min</div>
                            <div class="time-var time3">60 min</div>
                        </div>
                        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOEAAADhCAMAAAAJbSJIAAAAkFBMVEX////u7u4AAAD+/v7t7e3v7+/9/f339/fz8/MEBAT09PTq6ur5+fkICAjU1NSIiIi6urp3d3eurq4wMDBiYmLc3NwXFxfOzs6cnJyBgYHFxcVTU1M1NTUoKChvb2/S0tJGRkaUlJSwsLClpaU8PDwaGhpMTEwjIyNqamo0NDSOjo5jY2NBQUERERFSUlJ0dHTu/fk5AAAZCUlEQVR4nO1dCXvirBbOAgQDjbE241Zt1VY7tk7//7+750CiBpKYxGj9nltmbaXAy2E5O45rFOr4zDkUH37x/3YV547H9ovwF+Evwp8f2y/CX4S/CH9+bL8IfxH+Ivz5sd0OIemkys06Mqo41Cz+aWFQwour+Mz3OSUEvo+DovCbcsLw2912VFTFIUbhzmnxYVb4xVWwhMKF71P8I4irxtZ9R0VVnOBsCS+uEkoZ8jCQ8EsVGYQhfCk776ioijXXjLgnEyCIEPLiKlDJZUYN389X6KSjwir5DQMr2aXkuIhdQt2gTRWSVuFcE08ko3i1Ho+Xu+V4vH6MR0kQMJhw+Pyyjs5WsWko6OlRRYlrz1tVFdjrcKAxPFd4GNJkGo+/v969orJ/W4zjaeKGlLsctmfg4JnU4ViKSwcI4YhkRFIRrSaztz+F4E5g/p0NHl8E1KdSHRV3j9BHEjpONB7MMxC9Hv5lIOtlH6iyHYxH+lhkdTv6MYTwX57svvYaGmKAP71ChBqgrgTEfJ5ExHHucJW6RpVkt0khZLiOfxk0TOv09L9Q3iajLme7I4RQQ8DWw/0Hi3NtImlcdiOmdzO0CVfBHSCEE5pKJuEQDEYf70f6tC77p5jCaocmmXCbjeVqq1TdsuHqLR3iJQD1npyvBbToS0qajeU6CAl3KXPEeOidbq528PQJ+wB/vU8SZFgEbzSWa+1DHgTL5yO+k0ugBQEPP/tnQBxgA34WIVUsExe7lojOlUHCkRNz6Y8hJBxWEX18Oz/WlmU+BowZIX+EhoSHI7z9Lr4iSstzzLXc/EP7kCcD75KjpbroXfkUubxThL4wxWhb4Eqr0CD+qwFeiYa63T9r1IAQJQiWjqViuGYFamG2NAcEeQ5gkfmicvp7Gcepy374us3++zo8kad6lXcMfvomkCGH37YW4/xwW2gTOYUaAHH6pWCUITz8vX3+3MUJFPGUfjoUSfIymi4/nrd493kPWtAobEpN03YNcpWUDgubD7cFQkGRgGxZOfMZK91fj/Q0B5TIA0LJhRuqCX95XH5lSEpbgk8W1EHd3G00wpyCiJTM9KCKx6Uo87VYCaUH0ksa7pYDwkBwTpFTR5E+IPFgc/ipIioixLeRI33nNjQk1Hdetnr5lM285/WnRDcA7SHCkLhBhvAvD1EPqEVB1R0fjfcl+NRJht2ssJVrI4SrSQAtnHHpYNTqfB/Euc2vVdH0gHAYUrMjKFF/mNKsZNoGASAkOW68c4QgCnJBab+EbgAPVtrzOuIBLs0mCHG5smT16lXdPk9U6jvveggRI0+eSpgYNbDPFQ3h/sortM8jxOOZciqng3SeiqbPe41CLgitP9zmCAkNk7dyJma/mFLcKqLIYFJNQ/gqFFRA+5NtceO4ePdTDvfdNRFSGgHAh5Jl9DoFMhAU+l3/VKVkIeQ2DfEqQCmCUhkVcxJq9b7HoXsthMDiwxYYWUdedr7AytoKl1a0crgP5wHQobQjGh5uoqLF8sjVaVPVUWuE0GyytZVmsG0ecOvAB32Xl7ZCKN/NnlRZwNVR2hHlj9jogyEQH+bTixFiZiXsECGBXcJH71rHYNHQe9K816gcIY49tQuFgpfTkIhnBXC2L9QWQHdriQa6zhFywmm0L1g1uJaep+6TOgA/04OuoBWBZpp0NdCKVRosVZPbJPnn2TRUR0BM+RVWKQw9+Sq5JiZJSKd6xmNe1spBVkfVB7RW0hGN5qqTJdwLS7urB5xHPFHLh9vCyk24y2FdiWd7xeABM5w6knCuZeE9nOZ4ILayT+MxLD/VTH1RXNTiK93pZlGXBi6EjqzccE9xF2Sfol3hPSUOg+5o9K5W1xrNeW3t08CPTzWkVSCI4ExMiuWXvwmug5JWDPmwhtkYC5cDey7xbFmEjEv4nLGxOoX+gNjAW9qnZciJuim8by6lxJ9BFtgCCBU2FMdU1GgrK7f0pbP0io7u/RgmnpBAGS2QcX6bSrQBtrNP40JDsczzBG4pxuD7fFrA4sBAPoGVlawjKzeIns60WNG7CnG1CMkk1Ik9b8xBdpSspX0aTauOXL17fWgDqwAHQfnLsICGnrcGybIzK7fvJCYr08MV+jzCE/Kg3/LXNOPVLrKLSWW1SKtQGihW357eGIfflTYxmFnTCMf2PKF4xBxaZUrYvRShdgQ4InSFFLMiiMMElSmdIGRO35Jn4FD5Qn00Kr0PrTJYrJfTUFsisypCHeWLokPgH+sKIW4wu7wiQBKe0FDmx9aehrlWCHpqiO8ifrjfjc6bMPuqhzKPECDyl8dWZScI5UE9oFYpdkLpQRN5uooeRh0gBJmezQyFE/LFzwlP2aO6w1enGg5fnZi11tfRBAQQP4y7X40pkORShMByrwzNCQJ8eEFGrjmBHDIIAZ2sqlKEEBfqs4FQiWtM8HMmxnM0pMm71zMmz9vHAXKqLRD2vZ1yuWlGQ4orNZnn96Ia1DQ4JWILhMD+fqaoTlr21iFukDpjO1ZRp+wUzmTUNLKGZjwQS0A63ecBYnm7eB+GsVaQ5GZvgkoEnomC9REyYOxgAVCfNaShUlrwcG2cpUrKCtojpGqD5w28Cuon5S3cXJAb0NdOX7l2NXf6cMO+qQWD/0foc+xW7JjSVgEdcNVjY+2jQJ9wcW7tF/J+/gEhyqqNEcLORwmuZ2zGBaWHrdgMobrsYHfnIcI+evHPn1+Fwz8i9NsghCkPRaryOlmqXgzYq5wZymkogOkd2NzSxKlxB51BqHT4jRHCxDrxg3Fz9by3AJA3QHgwGwtgCROD44UvXmFDuSLv41zb+HxcpY3M6ZlWQJDQGeSmW6lt4gCoUd6K2c3RbAzzPPGsMgJOOO8F6hQYwouNz+GjXgUcxdYa5vR8FSQ8p+KvNaR//FQdVd/KDf8ktvfyBBU9jn/qMls/lCVDGOJqahx0wtB1lfC1NSa4YVOZppk2ERocmE09eMO1QOttu2CdyxBKGFEQxhsb4Vdmy2uI0EksH20U7Icxya3S29EQ/VcLZWEgYhuEfoGlV19GH8JxGo2tI4ROuPxTZCHueU+taOjwh3wzqaFEsUoEFRblrV4Boe8Ej+lAvFS5fxyaF5W3UoFwZd0Uc0/ft/C/hN0SIUoj/quXMaPz3K2P3xy0Qcj+GXert42UG6IyQgfOTRHix7PUSvm+FBtT2NkmLRCOPM/gjyZwGy3nqvFHBx3Nb7hKAWO0VZqLQcJxvRqbcd0C4SQvUsPkRfDDPPqALzaovL0lQrztfeQ/XuMQDRZ/89I+LNxmCNXwLZPIRP0sl6OZlzi1x9YRDbHwP68rpiqF9rUfqXHXpiGswPhwbmVEnKZSPReR/BGehiVEqu8Dhzo3Ee5QuVUbIWJcmCt9dvhR7v8IwhAkrlT5JaTlWv5GAGCTfahY0hzGOBPsCWW+6UpyC4SSHXwTOYkslnmk2qiPUBkqTyG+gWSvIQrOmEnDerHc5xBWt8Iky3wKREAsn5uJk+7DWlZu5uRVzIB0x7lbbp+uY8KmqHpVY+G0lSHcP1Qhbjg1L4y5rw0CNa3cgbGTe17iikzMbGfCRqfGg3xIxGWB2q4ITKfb3qiBlTtkli3mzQkCM/a6mQkb/rCUhqy4qdqB2ozLgPXNg2LMCltxzKLMxqF1VK31rXuscihNQqyPmqhLWkE1lq94rlyZifpWbi7+5Vlbbx+hcZCV2qdrmLAxiPmoL70oUFtxjKElCif1rdyogToFCAJYF8GrJ9rEevbp6iqWEgnDa2pqE3lsHlTL+h3fDKG1TCdBbYSh5eYc3R9CPzTJMGtAw1lecPK2/A5XKfswyPCW1EVIky9jdhadJALoFiHL65F6yqHPLdAIF7TKp6b3zNq5PxoqL6YcQm8VclqLhshc5RVa0/od3wyh71DTH6wPR009hGMD4da9R4S+82Ug3ARQvw7C0NrCDTq+GUKQOiydfODWO2kC0/jxdJcIfecxN0pYdZLUQCihjnnRjHMxPneCELVvJg0jkNHOIfSxVfMHp3mN0N0gTMyBxqErmNmK2agvuDU1yT0ihEYsd7QxIDxHQ8YEN4XDvcgz6PeCkIWmU+iOn1+lDtBwbahonkne5tvcPk06sXJbVaSprEGV7jkrN8ZkmerWf+LQEzrvNLdPqyqu4DTTRGFqunatqCGkYyHcFKAmBa2YujZs1QzkeDrJMELKY0FOS5EijYhA03AieVVkV2UrFL1g9IeCc1MVsYDqoalrK0Boyk7fPOShLsrlst3YMLTwW7W3SVzaep6AculgeBhYtAjtYOgCfaklPP9br8dpGWHAUcvZJyI7GP6OeHuEIlnqsazXa5P52nDnLEJSgPCkLMPWq5TSrN2et0FCWJtMclWqEVI6LR/el3seocuZze4dy5gXd1wH4eGahWN6snpcxVZZQXmc8kO4dlFHhFcgfCM1ELqOX57u4hKE4WHTVCcKeZgktCL0rhLhszh/0lDiSHN1d4OQH5dGryRaOy3bVUWc5sUI4TvsSjScZFxEdT4bpHA/vAChiccc29X24dFdqyi+N/cNWKfXoyFaQyyEx97HQfvbQswPqWgqy2YkS0+aUPCqsxRPmnP2Q1FwW+zf/6QFaEhbn6Vifdh9m+/vxWJgFvjeYvGxFFmcQ+FKABr2suG8mxqzOrdF0X34Gb1EuoxUNGnLu5rLjFn6IAEPbRmAaV5F8LC8FeQb09GMosjkvmZ1bnyYBZPb+8hS4VIOv0R7biScPr0Nn2crmCZKqGEz8dMdRLkg5fehUKNQY+EnF1BGC+n4Nc7SAs47c3vWPuON7dPZGUFCnkQJRodgUN9pOm8VqqDHRg75EopXQhaKD/Us68PCL0BoGpYBoSk9vSZq6qpM2DWs3DSb+Q5aUZZuWFDmmYi2fG60YcqHyHmbMv48yde5RlLzFlWoEJ/GSHdqrRvyoW1JlpbZKpFhuYW7kX26yyoyJKaRdOnYbZjnmc9c11JhRfkczddIat6qiuUZteakhpUbJFUTYezkq3ST1PzCKqxAmzh1uY55z51h5rwJKk1Hjn43GuFuq8Axe7qdFLOLGXRqafV1PqpjmRmr9C4QMmk7oktaQ5uIq9Q8hIc3H36NKr50zNjgdylEfeva6U/uE7PKHSAEjKbK+0kCy1ULoeURFZtV7gCh74hT/0Tch8uA1NuH9GVuOAwtzSp3gTBHCBxwzOt6KohXL//DM2lUuQOEhqcCjPJ9WhehG5jckMfNKj+P0LeSdbyK+h5D5uzkN+J9IGTE1BZ81PcYorZD1f0hhG1oRLwsw/o+UblTSkWOUmTcLk960U0VX/3+MGn4QuvTkFhO0CPc2veCUI1DmInS30UDhNTih3Yqje+dIFTFcvRe0Pqx3NSd5nXScJ068n4QqpFYmvn1aUaniqIty25O8sId/aKekEmrGKHcrRKJN66Sy1juOyYJH0bULWzF7AYtyyBJWB6mmLoglURdhxlSV4tE4i1iuVHfqEdABbf20WvqXVgvlrvAT3wY0SxxgcvaaBMvrsJA/D0YuO2cQ2P0Hi9opSzuyTqpvHGWCYYQxtpFBV2IkAUyy1JZYLxIGsQ9KSJa8Qh/MzUmp86PIMTkKKlNitgWwFngN4hdY4aGQJeYK4hUJrtTBdbtaOisR0zPMrdzIYz17moSQ7o1bbUblUhYPWmxVku5cQzpJVVg1URAqRfMNermM4qrMHOqoqEbITTcaHVOJuKucYM+C+fGCGFGMbOpt+0LnOU8V+k9eDOkcUOE2Eqes53RYIo62AfkxINM/XYLhEoRFuu3BeaPPFjqByNOt5AC2DAef2Eu0/36qaeSmfWUu6Ijb4ZQnX6HzDRfq2fTyvqqUiA03IfGWdM72G/x34Vg2ZVxK4T+LtstXpp682SZ9tUcNIh0xsLYpigTs0qFdRpCc7Oz1CEDvYLsvBgebZW9xVl5ZlH4nteyZfaWy6oAjfDppaLMH5NWuU3g8CpM/toXodMye8uFCGFe5dgKU8eStMpt4tumUtS6JS7hP0RD3w84FwW+MB+Z1aEZQsl8YRLxQWt7ci7Dda3cF1dRhnDXFiowv9opDetnLIeferQT3qxDSlSGzvb26ZZVYMol59YJ3/MG+DhTaSuVGct9f5+XMzFHzQvljsxVupWVGzMOiI2hjochJU4qGjbNWC45Y8ZOROPAhsEHRk7ym1i5OVDQ9PVBEi4cGZzkLq+fsVxg7kAz5Bkhjp3TBHC3s3K7grs61UOuzF/Ua+3lrZRaljHZuhkRrN0mR+6p98nNrNzIcQ8Nx0YY0C7kh/G0yVjOdY4Tw5xI0GmFtMlB27YKRxd98c88RXveX3GuleqOXR4VPKy9UdqgC58lbFJFP4gBUqHt1rgKL80jjL5j+XZ7GJ+ArluXPZ7ZpApsfFewomcSnvjFeYSpMI1Y2MtEYvrWG9KQErl+sAEOk/P5cM91LLjptaJYgMcgy9J6k31IBHpq2S7wj875h63PdIzumEWrA3gbla8pLNakd4cQE10rx01T94RX4VOdVmp0LIveX3mIQ7x/rk5DdLeE6yCy05Y+qNcROkHIEvsVJPh6xVwM9bk2DYG7EGE0LxpBXKuVGh37dkIe3BJ/1gFm4nWvvA/hdzD9WxSGsqvXSo2OJbNDoRRrsZL6MTbb3tPhKnXhkNkWPZb5JllXCNHm81n4IOcuoCqplX7Zgm4eA8w5JluHwKKM5LDp5kWlLpMMwx2JfCx4PgQfpGWdveCBBkmx94pUQBOBb3MTqQzEY9RJ48tCbRGqeRLfezwjfXyRh2Bkwtp+rg9HMlX6w44QovOl/Syg2uxP+CosUe8DE6Wx7QtHNkuaf4IQyKYDaaeoccbIeS769l2FAMeqm+4Q+qzoKRak6hAkYjfE4QzU1/+o0ly2Qogybj/z/UDVE+XJrOAyRn0YGk5kq31YbHwGkLa9TWH03tcBxT0f6QS1I6VbaW/lDjWJ1qrPYPrmFT68+oQ6fPWqUHfvcgNbMbGsBbosaABn6pdOmSVLWzlEhAsMoSzrKNQWoV6EkSP243n6keVZJvJ2+S634FR8p0vELJtpED7qRLzpE4+FsdyHyBsXn1Qt6Ygmr8qYNOE8erLfeVaqp01Cq4Iw86XBC4+Eh7MCKqoHNSfRVu3CflVsJEySCvSl+Gh1eUf6zRBvimeO/WLmAz7+yOlV3iFFidB+dglnFXtVSfyHFVFnsAATHZOVRLIqXpp/KNLt1Ulm09B7i7jSsHSOEPcOF7OCo7untXp4hFd0DNzl4n2OZftaFdVP6aiX8kyFAcPzCF9aFeeG2wKh+pC7C688VHnDODLKqME5qDCPCKvfdFYd6fc7/eJwec1xvCY5pXbnCKm2G5Qg3PYTF7X+MNSckqsuQpQ1ORePZv6nE4QzlZPtigiJq98tKYQI33zfJZLiSFshBO4oFOO3shmE725QU0vrDrcFQjxuCB8/FAebKynyfTFCVXKrVUpJtByaBt5TgHBUw/oQtYfbAqHaKGXR1Jmh/eMxCJsjhBJ/o6rioezZbwxNI+4xAPMqCNMfSgptsSdlMNWMpfI+UmYsINDJy+MoFvlO9sgc4pPRuIC3P5AP+trGDrOGchWElIIoWPxw5kl5HYxcdnByYQ6Q7YgQHXO4cr1SMp4fJrtZVZYF/cwUSBNBvaTTl9JQYDbadVVcvQa//1hPVVtIJ2jlFCGcKZlzXLSazFNKldPQmwSsnSW5DQ25kndfXksHhCXdTPN/u2kiOKZT5ycIeUgDJxTJdPw03FejU2UbM5Xl90o0NFol+JKOlI5bkV0ibyIazr53y3UcZdrz4Uv8uOwPZs8n1StRbtC9BRd1vbD4PMI2xmcnNVvFb5rZt7jHbopqGQWWsTICtrSV13qXu7SKSH14roVQtTxLao2lrEqdd7nLP3FkjBzWmU10AUbYgWvOahvCm1m5U3G80vgsaOgqLuRa+N4HAladqDOW0ioXGp9dN4y+r4IPy2aETC65yFZu07CplszlMlKnamFinZZFXTWf06ALzfnFCEGg4nL0kcK7HGIvfWD03zRwBKXNxnIVhCgWw3bWuWI6oKHmFD6ncCxKKs6ZP2+BkOPr5+hXJvqvtm6sBULgCD4S9bYAdHQPCFEkDfT7ViIuls6ble060cEVPiPiPlbpSeCjI3aHfCO93tFz+gzRjg6Cz5MXx+k20PFyGh4DHxUh+Wj3rAfeS7WrVQjxWHnI1KLDxVQoP9J7RYi2P/0S1Gg8OwKokCM1+fT/3/qxspD4ygB5nwiVszzuH/hSJPFgNjzAqC7zfx+PCeEAzNcu93dLQ6YQ4iEhVUKol3j9afmKG+V9No5HaITkcCLrCfKzh1zvDqFZBfNeBYFM4nF/8DT7+nv0iPkzf559fE+WcQR8csh5SQTv3SPUHwNHACI94UKIBEqEf8H/uaQUsLkNX2i/P4TKZQqdVY0qsJTxIoUL/er+f1dGSFVWaiHIMX2T2mtopFeexvTmNOw4Clv9i86TJg2VZCdct6uOyquYFa4Rhf2jVdroS/9bVX4R3vnwfxH+Irz/4f8i/EV4/8P/RfiL8P6H/4vw/wLh/wDRQEjdOmcyUwAAAABJRU5ErkJggg==" alt="" />
                        
                    </div>
        </div>
      </div>
    </header>

<div class="tabs">
<div class="tab first active">
tab1
</div>
<div class="tab second">
tab2
</div>
<div class="tab third">
tab3
</div>
</div>
<div>


<div id="text">
<div class="time-min">02</div> :
<div class="time-sec">00</div>
</div>
<button class="start-btn active-btn">START</button>
</div>
</body>
User contributions licensed under: CC BY-SA
4 People found this is helpful
Advertisement