+
+
+This example shows how to position an element based on the document XY coordinate system.
+Click anywhere on the gray box below and the little orange box will move to the click position.
+
+
+
+
+
+
+
+
+
+Setting up the HTML
+First we need some HTML to work with.
+<div id="demo-stage"> + <span id="demo"></span> +</div>+ + +
Getting the Dimensions
+In this example, we will listen for clicks on the document and update the position of our demo node to match the click position.
+var onClick = function(e) {
+ Y.one('#demo').setXY([e.pageX, e.pageY]);
+};
+
+
+The last step is to assign the click handler to the document to capture all click events.
Y.one('#demo-stage').on('click', onClick);
+
+
+Complete Example Source
+<div id="demo-stage">
+ <span id="demo"></span>
+</div>
+
+<script type="text/javascript">
+YUI().use('node', function(Y) {
+ var onClick = function(e) {
+ Y.one('#demo').setXY([e.pageX, e.pageY]);
+ };
+
+ Y.one('#demo-stage').on('click', onClick);
+});
+</script>
+
+