Skip to content

Latest commit

 

History

History
58 lines (31 loc) · 2.12 KB

README.md

File metadata and controls

58 lines (31 loc) · 2.12 KB
Raw

Lifecycle events Code Climate

Enable lifecycle events for HTML elements: attached, detached.

Usage

$ npm install lifecycle-events

	var lifecycleEvents = require('lifecycle-events');

	//enable lifecycle events for all elements on the page
	lifecycleEvents.enable();
	$('.my-element').on('attached', function(){});
	$('.my-other-element').on('detached', function(){});

	//Disable all lifecycle events
	lifecycleEvents.disable();


	//Enable lifecycle events for a Node/NodeList
	lifecycleEvents.enable(element);
	element.addEventListener('attached', function(){});
	element.addEventListener('detached', function(){});

	//Disable lifecycle events for the previously added element/selector
	lifecycleEvents.disable(element);

To make it work in IE and old browsers, you may need to polyfill MutationObserver, WeakMap, WeakSet, Element.matches, Element.contains: //cdn.polyfill.io/v1/polyfill.min.js?features=default,WeakMap,WeakSet.

API

lifecycleEvents.enable(selector, [container])

Enable lifecycle events for an Element, NodeList or selector. If no selector specified, '*' is used. An optional container element/selector may be specified in speed purpose.

lifecycleEvents.disable(selector)

Disable lifecycle events for previously registered selector. If no selector specified, all lifecycle events are unbound.

lifecycleEvents.attachedCallbackName

Callback name used for attaching lifecycle event. attached is used by default. Synomim: DOMNodeInserted.

lifecycleEvents.detachedCallbackName

Callback name used for detaching lifecycle event. detached is used by default.Synomim: DOMNodeRemoved.

Also see viewport-events for enteredView and leftView events.

NPM