■

マウスボタンイベントが生ずると、イベントオブジェクトにはどのマウスボタンが押されたかやマウスポインタの位置などを表す追加的なプロパティが与えられます。どのマウスボタンが押されたかはイベントの button プロパティにより得られます。値 0 は左ボタン, 1 は右ボタン, 2 は中央ボタンです。マウスの設定を変えた場合、これらの値は異なってくることがあります。

When a mouse button event occurs, a number of additional properties are available to determine which mouse buttons were pressed and the location of the mouse pointer. The event's button property can be used to determine which button was pressed, where possible values are 0 for the left button, 1 for the right button and 2 for the middle button. If you've configured your mouse differently, these values may be different.

detail プロパティはボタンが何回連続して素早くクリックされたかを保持しています。これにより単クリック, ダブルクリック, トリプルクリックの判別が可能になります。もちろん、ダブルクリックのみのチェックを行いたい場合は dblclick を代わりに使うことができます。 click イベントは最初のクリックで一度、次のクリックでもう一度、３度目のクリックで更にもう一度といった具合に生じますが、 dblclick イベントはダブルクリックごとに一度だけ生じます。

The detail property holds the number of times the button has been clicked quickly in sequence. This allows you to check for single, double or triple clicks. Of course, if you just want to check for double clicks, you can also use the dblclick event instead. The click event will be fired once for the first click, again for the second click, and again for the third click, but the dblclick event will only be fired once for a double click.

button と detail プロパティはマウスボタン関連のイベントにのみ適用されるものであり、マウスポインタ動作関連のイベントには適用されません。例えば mousemove イベントでは両プロパティとも 0 に設定されます。

The button and detail properties only apply to the mouse button related events, not mouse movement events. For the mousemove event, for example, both properties will be set to 0.

しかしながら、イベントが生じたときのマウス位置の座標を保持するプロパティは、すべてのマウスイベントに対し与えられます。座標には２つあります。まず screenX と screenY プロパティはスクリーンの左上隅からの座標を表します。次に clientX と clientY プロパティは文書の左上隅からの座標を表します。マウス座標を表示する例を示します：

However, all mouse events will be supplied with properties that hold the coordinates of the mouse position where the event occured. There are two sets of coordinates. The first is the screenX and screenY properties and are relative to the top left corner of the screen. The second set, clientX and clientY, are relative to the top left corner of the document. Here is an example which displays the current mouse coordinates:

Example 6.2.4: Source View

<script>

function updateMouseCoordinates(event)
{
  var text = "X:" + event.clientX + " Y:" + event.clientY;
  document.getElementById("xy").value = text;
}
</script>

<label id="xy"/>
<hbox width="400" height="400" onmousemove="updateMouseCoordinates(event);"/>

XUL Tutorial (XulPlanet.jp)