1.5.2 • Published 7 years ago

dom-align-ie8 v1.5.2

Weekly downloads
1
License
-
Repository
github
Last release
7 years ago

dom-align


align source html element with target html element flexibly.

NPM version build status Test coverage gemnasium deps npm download

Screenshot

Install

dom-align

Feature

  • support IE9+ chrome firefox
  • support align points and offset
  • support auto adjust according to visible area

Online Demo

Usage

import domAlign from 'dom-align';

// use domAlign
// sourceNode's initial style should be position:absolute;left:-9999px;top:-9999px;

const alignConfig = {
  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,
  targetOffset: ['30%','40%'], // the offset targetNode by 30% of targetNode width in x and 40% of targetNode height in y,
  overflow: { adjustX: true, adjustY: true }, // auto adjust position when sourceNode is overflowed
};

domAlign(sourceNode, targetNode, alignConfig);

API

void domAlign(source: HTMLElement, target: HTMLElement, alignConfig: Object):Function

alignConfig object details

Development

npm install
npm start

Example

http://localhost:8020/examples/

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

dom-align is released under the MIT license.