Cara Membuat Timer Count Down

Hallo teman teman balik lagi dengan saya Ismet Maulana kali ini saya ingin berbagi pengetahuan mengenai Bagaimana Cara Merancang Timer Count Down.

Oke seketika saja teman teman dapat salinkan scriptnya di bawah sini :

<script language=javascript>
 
var mins
var secs;
 
function cd() {
  mins = 1 * m(1); // ubah menit
  secs = 0 + s(:01); // ubah detik
  redo();
}
 
function m(obj) {
  for(var i = 0; i < obj.length; i++) {
      if(obj.substring(i, i + 1) == :)
      break;
  }
  return(obj.substring(0, i));
}
 
function s(obj) {
  for(var i = 0; i < obj.length; i++) {
      if(obj.substring(i, i + 1) == :)
      break;
  }
  return(obj.substring(i + 1, obj.length));
}
 
function dis(mins,secs) {
  var disp;
  if(mins <= 9) {
      disp =  0;
  } else {
      disp =  ;
  }
  disp += mins + :;
  if(secs <= 9) {
      disp += 0 + secs;
  } else {
      disp += secs;
  }
  return(disp);
}
 
function redo() {
  secs--;
  if(secs == -1) {
      secs = 59;
      mins--;
  }
  document.cd.disp.value = dis(mins,secs); // pengaturan tampilan.
  
 if((mins == 0)  (secs == 0)) {
      document.getElementById('cd').submit();
  } else {
    cd = setTimeout(redo(),1000);
  }
 
  
}
 
function init() {
  cd();
}
window.onload = init;
</script>

<form id=cd action= name=cd method=post>
  <p>
    <table width=50% border=0 cellpadding=5 cellspacing=1>
      <tr>
        <td width=100% align=right><input name=disp type=text id=ini value=10:00 size=5 readonly=true border=0></td>
      </tr>
    </table>
  
  </p>
  
  <p>nbsp;    </p>
</form>

<style type=text/css>
#ini {
  border:none;
  font-family:verdana;
  font-size:50px;
  font-weight:bold;
  border-right-color:#FFFFFF;
  color: red;
}
 
</style>

Seandainya telah di salin kemudian teman teman save dan jalan kan di browsernya, kemudian lihat tampilannya .

Lumayan gampang bukan?kita telah selesai mengerjakan mengenai Bagaimana Cara Merancang Timer Count Down, oke lumayan demikianlah panduan mengenai mengenai Bagaimana Cara Merancang Timer Count Down.

Selamat mencoba dan terimakasih …

 

#KeepLearn

#IsmetMA

 

Sumber https://kursuswebsite.org