0
6.8kviews
Write DHTML program to handle any 3 mouse event.
1 Answer
1
555views

DHTML Program for Mouse Events

  • Event onclick is used to set the background color.
  • Events onmouseover and onmouseout change the font color and style of text inside the span element when mouse come over and go out of the text.
  • Event ondblclick displays new text when user double-clicks on paragraph line.
<!DOCTYPE html>
<html>
<head>
<title>Mouse Events</title>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "This is the Output of ondblclick Mouse Event";
document.getElementById("demo").style.color = "red";
document.getElementById("demo").style.fontWeight = 'bold'
}
</script>
</head>
<body>
<center>
<h2>Select the Background Color</h2>
<button onclick="document.body.style.backgroundColor='violet'">Violet</button>
<button onclick="document.body.style.backgroundColor='yellow'">Yellow</button>
<button onclick="document.body.style.backgroundColor='skyblue'">Skyblue</button> 
<button onclick="document.body.style.backgroundColor='white'">White</button>
<br><br>
<span onmouseover="style.color='red';style.fontWeight = 'bold'" onmouseout="style.color='black';
     style.fontWeight = 'normal'">Mouse over this text</span>
<p ondblclick="myFunction()">Double click on this paragraph line to trigger a ondblclick Mouse Event</p>
<p id="demo"></p>
</center>
</body>
</html>
Please log in to add an answer.