AngularJS Example:

by michaeldausmann

HTML

<div ng-app="app">

    <div class="alert" report-mousemove="mousePos">
            x:{{mousePos.x}}, y:{{mousePos.y}}
    </div>

</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<style>
.done-true {
  text-decoration: line-through;
  color: grey;
}

JavaScript

var app = angular.module("app", []);

app.directive("reportMousemove", function ($compile) {
	return {
		terminal: true,
		priority: 1,
		transclude: true,
		scope: {
			position: "=reportMousemove"
		},
		link: function (scope, element, attrs) {
            scope.position = {x:0, y:0};
			scope.update = function (event) {
				scope.position = {x: event.x, y: event.y};
			}
			attrs.$set("ng-mousemove", "update($event)");

			$compile(element, null, 1)(scope);
		},
		controller: function ($element, $transclude) {
			$transclude(function (clone) {
				$element.append(clone);
			});
		}
	}
})