How do I use sync events with JavaScript to show then hide a message?
I want to display a greeting for 3 minutes after which it should disappear. I want to handle JavaScript onLoad event. Below is the code I tried using onClick because I don't know how to handle onLoad. Please give me the correct code.
<html>
<head>
<script type="text/javascript">
function timeMsg()
{
var t=setTimeout("alertMsg()",3000);
}
function alertMsg()
{
document.write("Hello");
}
</script>
</head>
<body>
<form>
<input type="button" value="Display alert box onClick="timeMsg()"/>
</form>
</body>
</html>
+3
source to share
1 answer
First you want to display a message, and then start a setTimeout timer with a duration when you want your "hidden" event to fire. Time is also measured in milliseconds, so 60,000ms is 60 minutes and 180,000ms is 3 minutes.
<script type="text/javascript">
function showMessage() {
document.getElementById("container").innerHTML = "hello!";
setTimeout(function() {
document.getElementById("container").innerHTML = "";
},180000);
}
</script>
</head>
<body onload="showMessage()">
<div id="container"></div>
</body>
+1
source to share