JavaScript Program to Demonstrate Mouse Right Click, Mouse Double Click and Other Mouse Events
Write a JavaScript program to demonstrate mouse right click, mouse double click and other mouse events.
Source Code
<html>
<head>
<title>Demonstrate mouse events</title>
</head>
<body>
<div id="panel" style="background-color: yellow;"> </div>
<script>
function init()
{
var panel = document.getElementById("panel");
panel.onmousedown = mousedown;
panel.onmouseup = mouseup;
panel.onmousemove = mousemove;
document.oncontextmenu = contextmenu;
panel.onmouseover = mouseover;
panel.onmouseout = mouseout;
panel.ondblclick = dblclick;
}
function mousedown()
{
panel.innerHTML += "Mouse clicked<br/>";
}
function mouseup()
{
panel.innerHTML += "Mouse realeased<br/>";
}
function mouseover()
{
panel.innerHTML += "Mouse over<br/>";
}
function mouseout()
{
panel.innerHTML += "Mouse out<br/>";
}
function mousemove(e)
{
panel.innerHTML = "Mouse move at x: " + e.x + ", y: " + e.y;
}
function dblclick()
{
panel.innerHTML = "Mouse double clicked";
}
function contextmenu()
{
alert("Right click disabled!");
return false;
}
document.addEventListener("DOMContentLoaded", init, false);
</script>
</body>
</html>
Output
