balance3D — DOM elements 3D balancer
It uses DeviceOrientationEvent (deviceorientation) and CSS 3D Transforms to balance DOM elements accoring to current device orientation
balance3D(element[, options]);
options = {
perspective: pixels,
/*
Distance in pixels
You can think of it as though you’re looking at the page from a such distance away
Default: 1000
*/
smooth: seconds
/*
Orientation information from device comes with jitter, smoothing will improve visual perception
Time in seconds to smooth the animation
Default: .3
*/
}
balance3D(document.getElementById('elm'));
balance3D(document.getElementById('elm'), { perspective: 500 });
balance3D(document.getElementById('elm'), { smooth: 1 });
balance3D(document.getElementById('elm'), { perspective: 300, smooth: .2 });
Stop balancing element elm
balance3D.stop(elm)
Stop balancing all elements
balance3D.stop()