javascript random six digit number with animation code example
Example 1: javascript random six digit number with animation
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="output" id="output0">--</div>
<div class="output" id="output1">--</div>
<div class="output" id="output2">--</div>
Example 2: javascript random six digit number with animation
.output {
margin: 20px;
padding: 20px;
background: gray;
border-radius: 10px;
font-size: 80px;
width: 80px;
color: white;
float: left;
}
Example 3: javascript random six digit number with animation
var numbers = [12, 54, 32, 45, 21, 69, 20];
function generateNumber(index) {
var desired = numbers[index];
var duration = 2000;
var output = $('#output' + index);
var started = new Date().getTime();
animationTimer = setInterval(function() {
if (output.text().trim() === desired || new Date().getTime() - started > duration) {
clearInterval(animationTimer);
output.text(desired);
generateNumber(index + 1);
} else {
output.text(
'' +
Math.floor(Math.random() * 10) +
Math.floor(Math.random() * 10)
);
}
}, 100);
}
generateNumber(0);