align source html element with target html element flexibly. port from kissyteam/component align
- support ie6+ chrome firefox
- support align points and offset
- support auto adjust according to visible area
var domAlign = require('dom-align');
// use domAlign
// sourceNode's initial style should be position:absolute;left:-9999px;top:-9999px;
domAlign(sourceNode, targetNode, {
points: ['tl', 'tr'] // align top left point of sourceNode with top right point of targetNode
offset: [10, 20] // the offset sourceNode by 10px in x and 20px in y
});| name | type | description |
|---|---|---|
| points | String[2] | move point of source node to align with point of target node, such as ['tr','cc'], align top right point of source node with center point of target node. point can be 't'(top), 'b'(bottom), 'c'(center), 'l'(left), 'r'(right) |
| offset | Number[2] | offset source node by offset[0] in x and offset[1] in y |
| overflow | Object | if adjustX field is true, then will adjust source node in x direction if source node is invisible. if adjustY field is true, then will adjust source node in y direction if source node is invisible. |
npm install
npm start
http://localhost:8000/examples/index.md
http://localhost:8000/tests/runner.html?coverage
dom-align is released under the MIT license.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent