Streaming live at 10am (PST)

Anyone know how these sticky side headlines are done?


#1

The headlines scroll to the side of the text.

http://www.codeandtheory.com/about-us


#2

Custom JavaScript.

http://www.codeandtheory.com/assets/compiled/public-07f93e490dd2aefc6d24c80c32117749.js

Line 14349:

getJobSections: function() {
	CT.jobSections = {};
	var $jobModules = $(".job-section-header");
	var $parent;
	var jobObj;
	var jobLockOffset = 60;
	
	$jobModules.each(function(i, el){
		$parent = $(el).parents('.job-section');
		
		jobObj = {};
		jobObj.el = el;
		jobObj.left = $parent.offset().left;
		jobObj.start = $parent.offset().top - jobLockOffset;

		jobObj.stop = jobObj.start + $(el).parents('.job-section').outerHeight() - $(el).outerHeight() - jobLockOffset;

		CT.jobSections[i] = jobObj;
	});
},

Line 14370:

lockJobSections: function(){
	var scrollY = $(window).scrollTop();
	
	if(typeof(CT.jobSections) === 'undefined') { return; }
	if( CT.$html.hasClass("touch") ) { return; }
	var jobs = CT.jobSections;

	for(i in jobs){
		$(jobs[i].el).css({
			'position': '',
			'padding-bottom': '0',
			'border-right' : 'none',
			'margin-left' : '',
			'top': '',
			'left': ''
		});	
	}
	
	// console.log(" ---------- ");

	for(i in jobs){
		// console.log( "start: " + jobs[i].start + " | stop: " + jobs[i].stop + " | scroll: " + scrollY);

		if( (scrollY < jobs[i].start || $(window).width() < 964) || (scrollY == $(window).height() + CT.buffer) ) {
			$(jobs[i].el).css({
				'position': '',
				'padding-bottom': '0',
				'border-right' : 'none',
				'margin-left' : '',
				'top': '',
				'left': ''
			});	
		}
		else if(scrollY >= jobs[i].start && scrollY < jobs[i].stop){
			$(jobs[i].el).css({
				'position': 'fixed',
				'padding-bottom': '20px',
				'border-right' : 'transparent',
				'margin-left' : '-1px',
				'top': 60,
				'left': jobs[i].left + 1
			});
		}
		else if(scrollY >= jobs[i].stop) {
			$(jobs[i].el).css({
				'position': '',
				'padding-bottom': '0',
				'border-right' : 'none',
				'margin-left' : '',
				'top': jobs[i].stop - jobs[i].start,
				'left': ''
			});
		}
	}
},

#3