マウスイベント

<style type="text/css">
.bg_white {background-color: #ffffff;font-weight: bold;}
.bg_yellow {background-color: #ffff00;font-weight: bold;}
.bg_fuchsia {background-color: #ff00ff;font-weight: bold;}
.bg_silver {background-color: #c0c0c0;font-weight: bold;}
.bg_aqua {background-color: #00ffff;font-weight: bold;}
.bg_lime {background-color: #00ff00;font-weight: bold;}
.bg_red {background-color: #ff0000ff;font-weight: bold;}
.bg_blue {background-color: #0000ff;font-weight: bold;}
.bg_green {background-color: #008000;font-weight: bold;}
</style>

<script type="text/javascript">
function mclick(obj){
obj.value = "click"; obj.className = "bg_white"; }
function dblmclick(obj){
obj.value = "dblclick"; obj.className = "bg_yellow"; }
function mdown(obj){
obj.value = "mousedown"; obj.className = "bg_fuchsia"; }
function menter(obj){
obj.value = "mouseenter"; obj.className = "bg_silver"; }
function mleave(obj){
obj.value = "mouseleave"; obj.className = "bg_aqua"; }
function mmove(obj){
obj.value = "mousemove"; obj.className = "bg_lime"; }
function mout(obj){
obj.value = "mouseout"; obj.className = "bg_red"; }
function mover(obj){
obj.value = "mouseover"; obj.className = "bg_blue"; }
function mup(obj){
obj.value = "mouseup"; obj.className = "bg_green"; }
</script>

<input id="btn1" type="button" value="操作ボタン"
onclick="mclick(this)"
ondblclick="dblmclick(this)"
onmousedown="mdown(this)"
onmouseenter="menter(this)"
onmouseleave="mleave(this)"
onmousemove="mmove(this)"
onmouseout="mout(this)"
onmouseover="mover(this)"
onmouseup="mup(this)">