dist/ui/chico.js
function Positioner(options) {

        if (options === undefined) {
            throw new window.Error('ch.Positioner: Expected options defined.');
        }

        // Creates its private options
        this._options = tiny.clone(this._defaults);

        // Init
        this._configure(options);
    }
function Positioner(options) {

        if (options === undefined) {
            throw new window.Error('ch.Positioner: Expected options defined.');
        }

        // Creates its private options
        this._options = tiny.clone(this._defaults);

        // Init
        this._configure(options);
    }
function Positioner ( options ) { if ( options === undefined ) { throw new window . Error ( 'ch.Positioner: Expected options defined.' ) ; } // Creates its private options this . _options = tiny . clone ( this . _defaults ) ; // Init this . _configure ( options ) ; }
The Positioner lets you position elements on the screen and changes its positions.
@memberof ch
@constructor
@param {Object} options Configuration object.
@param {String} options.target A HTMLElement that reference to the element to be positioned.
@param {String} [options.reference] A HTMLElement that it's a reference to position and size of element that will be considered to carry out the position. If it isn't defined through configuration, it will be the ch.viewport.
@param {String} [options.side] The side option where the target element will be positioned. You must use: "left", "right", "top", "bottom" or "center". Default: "center".
@param {String} [options.align] The align options where the target element will be positioned. You must use: "left", "right", "top", "bottom" or "center". Default: "center".
@param {Number} [options.offsetX] Distance to displace the target horizontally. Default: 0.
@param {Number} [options.offsetY] Distance to displace the target vertically. Default: 0.
@param {String} [options.position] Thethe type of positioning used. You must use: "absolute" or "fixed". Default: "fixed".
@requires ch.Viewport
@returns {positioner} Returns a new instance of Positioner.
@example
// Instance the Positioner It requires a little configuration.
// The default behavior place an element center into the Viewport.
var positioned = new ch.Positioner({
'target': document.querySelector('.target'),
'reference': document.querySelector('.reference'),
'side': 'top',
'align': 'left',
'offsetX': 20,
'offsetY': 10
});
@example
// offsetX: The Positioner could be configurated with an offsetX.
// This example show an element displaced horizontally by 10px of defined position.
var positioned = new ch.Positioner({
'target': document.querySelector('.target'),
'reference': document.querySelector('.reference'),
'side': 'top',
'align': 'left',
'offsetX': 10
});
@example
// offsetY: The Positioner could be configurated with an offsetY.
// This example show an element displaced vertically by 10px of defined position.
var positioned = new ch.Positioner({
'target': document.querySelector('.target'),
'reference': document.querySelector('.reference'),
'side': 'top',
'align': 'left',
'offsetY': 10
});
@example
// positioned: The positioner could be configured to work with fixed or absolute position value.
var positioned = new ch.Positioner({
'target': document.querySelector('.target'),
'reference': document.querySelector('.reference'),
'position': 'fixed'
});
The Positioner lets you position elements on the screen and changes its positions .