I would like to have three number counters on my Wordpress website beneath each other.
I was able to make the code work fine with the first number counter, but when I add two more counters beneath ("counter1", "counter2", "conter3"), they do not show any numbers.
Help would be appreciated!
THIS WORKED FINE ALL BY ITSELF:
up to <a id="counter1"></a><!-- counts --> times lower cost
<script>
let counts=setInterval(updated);
let upto=0;
function updated(){
var count= document.getElementById("counter1");
count.innerHTML=++upto;
if(upto===1000)
{
clearInterval(counts);
}
}
</script>BUT THIS DOESNT WORK (just multiplied the above code):
up to <a id="counter1"></a><!-- counts --> times lower cost
<script>
let counts=setInterval(updated);
let upto=0;
function updated(){
var count= document.getElementById("counter1");
count.innerHTML=++upto;
if(upto===1000)
{
clearInterval(counts);
}
}
</script>
up to <a id="counter2"></a><!-- counts --> times better quality
<script>
let counts=setInterval(updated);
let upto=0;
function updated(){
var count= document.getElementById("counter2");
count.innerHTML=++upto;
if(upto===1000)
{
clearInterval(counts);
}
}
</script>
up to <a id="counter3"></a><!-- counts --> times less time
<script>
let counts=setInterval(updated);
let upto=0;
function updated(){
var count= document.getElementById("counter3");
count.innerHTML=++upto;
if(upto===1000)
{
clearInterval(counts);
}
}
</script>when you define a <script> tag in your file, every variable are shared between them! so by changing the name of varables you can achive what you want.
up to <a id="counter1"></a><!-- counts --> times lower cost
<br />
<script>
let counts1=setInterval(updated);
let upto1=0;
function updated(){
var count= document.getElementById("counter1");
count.innerHTML=++upto1;
if(upto1===1000)
{
clearInterval(counts1);
}
}
</script>
up to <a id="counter2"></a><!-- counts --> times better quality
<br />
<script>
let counts2=setInterval(updated);
let upto2=0;
function updated(){
var count= document.getElementById("counter2");
count.innerHTML=++upto2;
if(upto2===1000)
{
clearInterval(counts2);
}
}
</script>
up to <a id="counter3"></a><!-- counts --> times less time
<script>
let counts3=setInterval(updated);
let upto3=0;
function updated(){
var count= document.getElementById("counter3");
count.innerHTML=++upto3;
if(upto3===1000)
{
clearInterval(counts3);
}
}
</script>enter code here