Capítulo 16

Eventos - Propriedades clientX e clienty

JavaScript

<script type="text/javascript">
var EventUtil = {
	getEvent: function(event) {
		return event ? event : window.event;
	}
}
window.onload = function() {	
	
	var demo = document.getElementById("demo");	
	var caixasTexto = document.getElementsByTagName("input");

	demo.onmousemove = function(event) {
	var event = EventUtil.getEvent(event);
	caixasTexto[0].value = event.clientX + " pixels";
	caixasTexto[1].value = event.clientY + " pixels";
	}
}
</script>

HTML

...
<p>Coordenadas do ponteiro do mouse:</p>
<label>Coordenada clientX: <input type="text" /></label>
<label>Coordenada clientY: <input type="text" /></label>
...
Passe o ponteiro do mouse nessa área

Coordenadas do ponteiro do mouse: