Formatting Output of 2 Minute Countdown Timer
I Want to Make Just a Standard 2 Minute Countdown to Go with a Quote on a Site "Every Two Minutes a Child Enters the System in the Us" I Have This Code, and I...
I want to make just a standard 2 minute countdown to go with a quote on a site "Every two minutes a child enters the system in the US" I have this code, and I want to make the output bigger, bold, and a different font. What and where do I add this info? Sorry I know this is such a basic question but would appreciate the help!
<div id=timer></div>
<script type="text/javascript">
var timeoutHandle;
function countdown(minutes, seconds) {
function tick() {
var counter = document.getElementById("timer");
counter.innerHTML =
minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
seconds--;
if (seconds >= 0) {
timeoutHandle = setTimeout(tick, 1000);
} else {
if (minutes >= 1) {
// countdown(mins-1); never reach “00″ issue solved:Contributed by Victor Streithorst
setTimeout(function () {
countdown(minutes - 1, 59);
}, 1000);
}
}
}
tick();
}
countdown(2, 00);
</script>
1 Answer
Give the div from the timer a class-name and than add the styling in your CSS.
var timeoutHandle;
function countdown(minutes, seconds) {
function tick() {
var counter = document.getElementById("timer");
counter.innerHTML =
minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
seconds--;
if (seconds >= 0) {
timeoutHandle = setTimeout(tick, 1000);
} else {
if (minutes >= 1) {
// countdown(mins-1); never reach “00″ issue solved:Contributed by Victor Streithorst
setTimeout(function () {
countdown(minutes - 1, 59);
}, 1000);
}
}
}
tick();
}
countdown(2, 00);.timer {
font-weight: bold;
font-size: 30px;
font-style: italic;
}<div timer id='timer' class=timer></div>You can include the css-file with <link rel="stylesheet" type="text/css" href="style.css"/> into your HTML-file.
Alternative: You could use inline CSS:
<div timer id='timer' style="font-weight: bold; font-size: 30px; font-style: italic;"></div>
But this solution is not recommended. It's good style to separate HTML, CSS and JavaScript in different files.
Marcus Vance is a cybersecurity auditor and technology writer dedicated to educating the public about online safety, data privacy regulations, enterprise security, and emerging cyber threats.
