Last updated on November 23rd, 2022 at 12:58 pm
In this tutorial you will see using javascript change button font color. Javascript setTimeout is very handy when we need to call functions within a definite time interval. In the below example script i am using setTimeout and implemented a simple logic to call 2 different javascript functions with a time interval of 2 seconds [2000ms]. The function will change the font color automatically after 2 seconds. This can also be used to call functions infinite times.
Script is very simple, When you click on the button it changes color of the font inside button from red to black and black to red.
function setToRed()
{
document.getElementById("colourButton").style.color = "red"
setTimeout ( "setToBlack()", 2000 );
}
function setToBlack()
{
document.getElementById("colourButton").style.color = "black"
setTimeout ( "setToGreen()", 2000 );
}
function setToGreen()
{
document.getElementById("colourButton").style.color = "green"
setTimeout ( "setToRed()", 2000 );
}
</script>
<input type="button" style="font-size: 24px;" name="clickMe" id="colourButton" value="Click me and wait!" onclick="setToRed()"/>
You can also use settimeout inside a web page to call function multiple times.
Here I am calling function setToRed() first followed by setToBlack() and setToGreen()
admin