YUI Library Examples: Node: Node Positioning

Node: Node Positioning

Setting up the HTML

First we need some HTML to work with.

<span id="demo"></span>

<span id="demo"></span>

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]);
};

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('document').on('click', onClick);

Y.one('document').on('click', onClick);

Full Script Source

YUI().use('node', function(Y) {
    var onClick = function(e) {
        Y.one('#demo').setXY([e.pageX, e.pageY]);
    };
 
    Y.one('document').on('click', onClick);
});

YUI().use('node', function(Y) {
    var onClick = function(e) {
        Y.one('#demo').setXY([e.pageX, e.pageY]);
    };
 
    Y.one('document').on('click', onClick);
});