Package Exports

position.js
position.js/dist/index.esm.js
position.js/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (position.js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

position.js

Positions a popup element to an anchor element 😉

Demo

position.js

Usage

const {
  placement, // actual placement
  popupOffset, // CSS position: {left, top}
  arrowOffset, // CSS position: {left, top}
  popupRect,
  anchorRect,
} = position(popup, anchor, 'top', options)

// DOM
Object.assign(popup.style, popupOffset)

// React
<Popup style={popupOffset} arrowOffset={arrowOffset} placement={placement} />

API

position(popup, anchor, placement, options)

Options

{
  // use fixed or absolute position, defaults to false
  fixed: false,
  // any scroller element, defaults to document.body
  offsetParent: document.body,
  // 'auto': adjusts horizontally or vertically, 'both': adjusts horizontally and vertically, defaults to 'none'
  adjustXY: 'none',
}

Placement Presets

top
right
bottom
left
center
top-left
top-right
right-top
right-bottom
bottom-left
bottom-right
left-top
left-bottom

Placement Combos

position(popup, anchor, {popup: 'left-top', anchor: 'right-top'})
// same as `right-top` placement
position(popup, anchor, 'right-top')