ResizeManager

Global module that caches the browser diminsions and triggers resize events.

NPM installation

npm i --save @superherocheesecake/resize-manager

Properties

Get viewport dimensions

const viewportWidth = resizeManager.viewportWidth;
const viewportHeight = resizeManager.viewportHeight;

Get document dimensions

const documentWidth = resizeManager.documentWidth;
const documentHeight = resizeManager.documentHeight;

Get and set the remBase

// get
const remBase = resizeManager.remBase;

// set
resizeManager.remBase = [int];

Get documentFontSize

// get
const documentFontSize = resizeManager.documentFontSize;

Methods

Use rem

If no base is given, it will ue the current remBase

resizeManager.rem(size [, base]);

Force the value to update

resizeManager.updateViewportDimensions();
resizeManager.updateDocumentDimensions();
resizeManager.updateDocumentFontSize();

Events

Listening to the events

resizeManager.addEventListener('resize', this._resizeHandler);
resizeManager.addEventListener('resize:complete', this._resizeCompleteHandler);

Changelog

2.0.0

• Moved to new NPM server
• Removed Bowser
• API changes

1.0.0

• Converted to a NPM package
• Updated dependencies
• Added ESLint and updated the code according to our code conventions

0.0.6

• Support for Rems

0.0.3

• Update values at 'resize:complete' event