set-it-off v2.1.0

set-it-off

4 quadrant positioning for your DOM. Use it with browserify.

npm install set-it-off

Use

This module adds a moveTo(x, y) method to the HTMLElement prototype.

var offSet = require('set-it-off')
var marker = document.getElementById('marker')
marker.moveTo(0,0) // centers the element

This method will translate the element to that position as if the window was a 4 quadrant grid. Ergo, moveTo(0, 0) will center the element. Not only that, it positions the element by its center, rather than its top-left corner. This is for absolute positioned interfaces.

Method.setParent

The module itself returns a method setParent(el, offSetX, offSetY) for setting the parent container for your grid, and offsetting the point 0,0. So you could set 0,0 to be anywhere on your page, or anywhere in relation to the center of any element, such as a canvas. Note that the offset value is in relation to the center of the element/window.

If you don't set a parent element, it uses the window.

var offSet = require('set-it-off')
offSet.setParent(document.body, [-100, -100])

or pass null for the element to offset the center coordinate of the window

var offSet = require('set-it-off')
offSet.setParent(null, [-100, -100])
var marker = document.getElementById('marker')
marker.moveTo(0,0) // centers the element

demo

Clone the repo and open public/index.html

browser.js is the pre-browserified code. Here's that code:

var cart = require('./')
var getids = require('getids')

document.body.style.height = window.innerHeight-1 + 'px'
document.body.style.width = window.innerWidth-1 + 'px'

var ui = getids(document.body)

setTimeout(function(){
    ui.firstControl.moveTo(0,0)
}, 1)
setTimeout(function(){
    ui.firstControl.moveTo(100,-100)
}, 1000)
setTimeout(function(){
    ui.firstControl.moveTo(0,0)
}, 2000)