JS implementation countdown to customize time and pause

JS countdown, can be customized, the effect is as follows, click Start to start timing, END end timing

js实现倒计时器自定义时间和暂停

Copy the H5 CSS JS code, respectively, specifically The algorithm is in the JS control function (all written)

CSS

 HTML, Body {Width: 100%; Height: 100%; .content {height: 100%; Width: 100%; }.row-center {display: flex; flex-direction: row; Justify-content: center; align-items: center;}. TC-ITEMS: center;}. tc-infut-style {Outline : none; border: none; width: 20%; Height: 80%; Border-Radius: 10px;}. TC-span-style {width: 30%; Height: 100%; font-weight: bold;}. TC -font-style {font-size: 15px; font-weight: bold;}. Tc-div-style1 {height: 33%; Width: 100%}. Tc-div-style0 {height: 30%; Width: 100 %}. tc-div-style2 {height: 10%; Width: 100%;} .tc-div-style3 {height: 100%; width: 30%}. column-center {display: flex; flex-direction: Column; Justify-Content: center; align-items: center;}. column-start-center {dISPLAY: FLEX; flex-direction: flex-start; align-item; center;} # timecount {height: 50%; Width: 20%;}. Button-style-0 {border-radius: 10px;}. Row-space-around {display: flex; flex-direction: row; Justify-content: space-around; align-items: center;}   

  Hours:  
START
Remember to introduce JQ
JS
VAR TIMECOUNT; / / Define a global variable function timer (in // Define a loop function Perform timecOunt = setInterval (function () {var hour = 0, minute = 0, second = 0; // initialization time default // algorithm control IF (INTDIFF> 0) {hours = Math.Floor (INTDIFF / (60 * 60 )); minute = math.floor (intediff / 60) – (Hour * 60); second = math.floor (intediff) – (Hour * 60 * 60) – (Minute * 60);} if (Minute

‘+ Hour +’ ‘); $ (‘ # minute_show ‘). HTML (‘

‘+ Minute +’ points ‘); $ (‘ # SECOND_SHOW ‘). HTML (‘
 '+ second +' second '); intDiff -;}, 1000; console.log (intediff);} function timecounts () {console.log ($ "# hour_count"). Val ()) Count) = PARSEINT ($ ("# hour_count"). Val () * 3600) + PARSEINT ($ "# minute_count"). Val () * 60) + PARSEINT ($ ("# second_count"). Val ()) Timer (COUNT); // Call the timer function console.log (count);} function timestop () {var husou = $ ("# Hour_show"). text (); var minute = $ ("# minute_show"). Text; "# minute_show"). TEXT (); var second = $ ("# second_show"). TEXt (); var time = parseint ($ "" # Hour_show "). text ()) * 3600 + PARSEINT ($" "# minute_show"). Text ()) * 60 + parseint ($ ("# second_show") .text ()) Console.log (time); timecount = window.clearinterval (timecount); // Stop timer}     
The above is all of this article Content, I hope to help everyone, and I hope everyone will support Tumi Clouds.

© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment