マウスイベント

Ajax 
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>イベントサンプル</title>
    <style type="text/css">
      body{
        font-family: Arial;
      }
      span{
        font-weight: bold;
      }
      #pad{
        width: 200px;
        height: 100px;
        background-color: #CCCCCC;
        border: #4C4C4C solid 1px;
        text-align: center;
      }
    </style>
    <script language="javascript" type="text/javascript">
    function dispProperty(e){
      document.getElementById('type').childNodes[0].nodeValue= e.type;
      document.getElementById('screenx').childNodes[0].nodeValue= e.screenX;
      document.getElementById('screeny').childNodes[0].nodeValue= e.screenY;
      document.getElementById('clientx').childNodes[0].nodeValue= e.clientX;
      document.getElementById('clienty').childNodes[0].nodeValue= e.clientY;
      document.getElementById('altkey').childNodes[0].nodeValue= e.altKey;
      document.getElementById('ctrlkey').childNodes[0].nodeValue= e.ctrlKey;
      document.getElementById('shiftkey').childNodes[0].nodeValue= e.shiftKey;
      document.getElementById('metakey').childNodes[0].nodeValue= e.metaKey;
      document.getElementById('button').childNodes[0].nodeValue= e.button;
      document.getElementById('detail').childNodes[0].nodeValue= e.detail;
      var taget_node;
      if(e.target){
        target_node = e.target;
      } else {
        target_node = e.srcElement;
      }
      document.getElementById('target').childNodes[0].nodeValue = target_node.id;
    }

    function setListeners(e){
      var pad = document.getElementById('pad');
      addListener(pad,'click',dispProperty, false);
      addListener(pad,'mouseover',dispProperty, false);
      addListener(pad,'mouseout',dispProperty, false);
    }
    function addListener(elem, eventType, func, cap){
      if(elem.addEventListener){
        elem.addEventListener(eventType,func,cap);
      } else if(elem.attachEvent){
        elem.attachEvent('on'+eventType,func);
      } else {
        alert('ご利用のブラウザは対応していません！');
        return false;
      }
    }
    addListener(window,'load',setListeners,false);
    </script>
  </head>
  <body>
    <div id="pad">Click here!</div>
    <div>target:<span id="target">N/A</span></div>
    <div>event type:<span id="type">N/A</span></div>
    <div>screenX:<span id="screenx">N/A</span></div>
    <div>screenY:<span id="screeny">N/A</span></div>
    <div>clientX:<span id="clientx">N/A</span></div>
    <div>clientY:<span id="clienty">N/A</span></div>
    <div>altKey:<span id="altkey">N/A</span></div>
    <div>ctrlKey:<span id="ctrlkey">N/A</span></div>
    <div>shiftKey:<span id="shiftkey">N/A</span></div>
    <div>metaKey:<span id="metakey">N/A</span></div>
    <div>button:<span id="button">N/A</span></div>
    <div>detail:<span id="detail">N/A</span></div>
  </body>
</html>

補足

    function setListeners(e){
      var pad = document.getElementById('pad');
      addListener(pad,'click',dispProperty, false);
      addListener(pad,'mouseover',dispProperty, false);
      addListener(pad,'mouseout',dispProperty, false);
    }

addListenerでDivのpadへ３つのイベントを定義してる。

document.getElementById('type').childNodes[0].nodeValue= e.type;
document.getElementById('screenx').childNodes[0].nodeValue= e.screenX;
document.getElementById('screeny').childNodes[0].nodeValue= e.screenY;

実際の処理dispPropertyにおいては、イベント変数eからデータを取得している。

      var taget_node;
      if(e.target){
        target_node = e.target;
      } else {
        target_node = e.srcElement;
      }
      document.getElementById('target').childNodes[0].nodeValue = target_node.id;

IE6ではtargetプロパティが使えず、srcElementを使う。