Crafty.js
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/crafty/0.5.4/crafty-min.js"></script>
JavaScript
var viewportWidth = 100;
var viewportHeight = 100;
Crafty.init(viewportWidth,viewportHeight);
Crafty.canvas.init();
Crafty.scene("game", function()
{
Crafty.background("#000");
var clickText = Crafty.e("2D, DOM, Text")
.attr({x:viewportWidth/4, y:180, w:150, h:40})
.text("Click somewhere")
.css({"font": "10pt Arial", "color": "#FFF", "text-align": "left"});
//Create an entity to track the mouse clicks
var mouseTracker = Crafty.e("2D, Mouse").attr({ w:viewportWidth, h:viewportHeight, x:0, y:0 });
mouseTracker.bind("Click", function(e)
{
//The Crafty.mousePos.x/y returns the mouse position in pixels inside the stage
clickText.text("Clicked:"+ Crafty.mousePos.x +", "+ Crafty.mousePos.y)
});
});
Crafty.scene("game");