//Vanilla JS script | Affix for Bootstrap 3
//by dnp_theme

//AFFIX DEFINITION
function affix(element,options) {
	this.element = (typeof(element) === 'object') ? element : document.querySelector(element);
	this.target = (options.target) ? ((typeof(options.target) === 'object') ? options.target : document.querySelector(options.target)) : document.querySelector(this.element.getAttribute('data-target'));
	this.targetOffset = (this.target) ? (this.target.offsetTop - this.target.scrollTop + this.target.parentNode.offsetTop - this.target.parentNode.scrollTop) : this.element.getAttribute('data-offset-top');
if (this.element && (this.target || (this.options && this.options.offset.top) || this.element.getAttribute('data-offset-top') )) { this.init(); }
	
}

//AFFIX METHODS
affix.prototype = {
	init: function () {
		this.affixed = false;
		this.getPinnedOffset = 0;
		
		//events
		this.checkPosition();
		this.updateAffix();
		this.scrollEvent();
		this.resizeEvent();
		
	},
	offsetTop: function () {
		return (this.targetOffset||null) || (this.options.offset.top||null) || (this.element.getAttribute('data-offset-top')||null) || 0;
	},
	checkPosition: function () {
		this.getPinnedOffset = this.offsetTop;
	},
	scrollOffset: function () {
		return window.pageYOffset;
	},
	pin: function () {
		if (this.element.classList) this.element.classList.add('affix'); else this.element.className += 'affix';
		this.affixed = true;
	},
	unPin: function () {
		if (this.element.classList) this.element.classList.remove('affix'); else this.element.className = '';
		this.affixed = false;
	},

	updatePin: function () {
		if (this.affixed === false && (parseInt(this.offsetTop(),0) - parseInt(this.scrollOffset(),0) < 0)) {
			this.pin();
		} else if (this.affixed === true && (parseInt(this.scrollOffset(),0) <= parseInt(this.getPinnedOffset(),0) )) {
			this.unPin();
		}
	},
	updateAffix : function () {
		// Unpin and check position again
		this.unPin();
		this.checkPosition();

		// If any case update values again
		this.updatePin();
	},
	scrollEvent : function(){
		var el = this;
		window.onscroll = function () {
			el.updatePin();
		};
	},
	resizeEvent : function(){
		var el = this;
		window.onresize = function () {
			setTimeout(function(){
				el.updateAffix();
			},100);
		};
	}
};
			
//DATA API
window.onload = function () {
	var spy = document.querySelectorAll('[data-spy="affix"]');
	if (spy) {
		for ( var i=0; i<spy.length; i++) {
			if ( spy[i].getAttribute('data-offset-top') !== null || spy[i].getAttribute('data-target') !== null ) {
				var $spy = spy[i];
				var data = {};
				data.offsetTop	= $spy.getAttribute('data-offset-top') || {};
				data.target		= $spy.getAttribute('data-target') || null;

				if (data.offsetTop		  != null) data.offsetTop    = data.offsetTop;
				if (data.target			  != null) data.target  	  = data.target;

				return new affix($spy, data);
			}
		}
	}
}

@@ -601,16 +601,17 @@
 -top');%0A
+%09
 if (this
@@ -748,18 +748,16 @@
 it(); %7D%0A
-%09%0A
 %7D%0A%0A//AFF
@@ -1282,38 +1282,96 @@
 : function () %7B%0A
+%09%09var reg = new RegExp(%22(%5C%5Cs%7C%5E)%22 + 'affix' + %22(%5C%5Cs%7C$)%22);%0A
 %09%09if (
+ 
 this.element.cla
@@ -1376,55 +1376,51 @@
 lass
-List) this.element.classList.add('affix'); else
+Name && !reg.test(this.element.className) )
  thi
@@ -1443,16 +1443,17 @@
 ame += '
+ 
 affix';%0A
@@ -1496,31 +1496,90 @@
 unction () %7B
+ %0A%09%09var reg = new RegExp(%22(%5C%5Cs%7C%5E)%22 + 'affix' + %22(%5C%5Cs%7C$)%22);
 %0A%09%09if (
+ 
 this.element
@@ -1588,14 +1588,25 @@
 lass
-List) 
+Name && reg.test(
 this
@@ -1623,62 +1623,110 @@
 lass
-List.remove('affix'); else this.element.className = ''
+Name) ) this.element.className = this.element.className.replace(reg, %22 %22).replace(/(%5E%5Cs*)%7C(%5Cs*$)/g,%22%22)
 ;%0A%09%09

Update affix.js