Tether.js - Transition small movements

tether.transition.css

.tether.tether-transition {
	transition: -webkit-transform 100ms ease-in-out;
	transition: transform 100ms ease-in-out;
}

tether.transition.js

var transitionModule = {
	className: 'transition',
	thresholdX: 50,
	thresholdY: 50,

	position: function(props) {
		var className = this.options.classPrefix + '-' + transitionModule.className,
			hasClass = Tether.Utils.hasClass(this.element, className),
			lastOffset = this._cacheOffset;

		var shouldAddClass = lastOffset &&
			Math.abs(props.left - lastOffset[0]) <= transitionModule.thresholdX &&
			Math.abs(props.top - lastOffset[1]) <= transitionModule.thresholdY;

		if(!hasClass && shouldAddClass) {
			Tether.Utils.addClass(this.element, className);
		}
		else if(hasClass && !shouldAddClass) {
			Tether.Utils.removeClass(this.element, className);
		}

		// Cache the offset
		this._cacheOffset = [props.left, props.top];
	}
};

Tether.modules.push(transitionModule);