https://www.stemcellbioengineering.ca/wp-content/themes/wp-hybrid-…/inc/navigation/js/navigation.js?ver=7.1.2

1(function($) {
2
3	sticky_obj = {
4		env: false,
5		place_holder: false, 
6		on_scroll: function(element) {
7			//account for mobile, so if mobile, do nothing!
8			if (!sticky_obj.env) {
9				sticky_obj.env = sticky_obj.findBootstrapEnvironment();
10			}
11
12			if (sticky_obj.env != 'desktop') {
13				return;
14			}
15			
16			//account for admin bar if logged in
17			var adminbar_height = 0;
18			if ($('#wpadminbar').length > 0) {
19				adminbar_height = $('#wpadminbar').height();
20			}
21
22			//make sure we have a menu
23			if ($('#ubc7-unit-menu.stick-to-top').length == 0) {
24				return;
25			}
26			
27			//make sure that place_holder is set, as it smooths things out when nav jumps out of flow
28			sticky_obj.place_holder = $('div.place_holder');
29			if ( sticky_obj.place_holder.length == 0) {
30				$('#ubc7-unit-menu').after('<div class="place_holder">')
31				sticky_obj.place_holder = $('div.place_holder');
32				sticky_obj.place_holder.css('height', $('#ubc7-unit-menu.stick-to-top ul:first').height());
33			}
34			
35			if ( sticky_obj.place_holder.height() == 0 ) {
36				sticky_obj.place_holder.css('height', $('#ubc7-unit-menu.stick-to-top ul:first').height());
37			}
38
39			//get top of menu
40			var eTop = $('#ubc7-unit-menu').position().top;
41			//we need this because once we separate the menu from normal flow, it becomes 0, so we use div.place_holder instead
42			if (Math.round(eTop) == adminbar_height) {
43				eTop = sticky_obj.place_holder.position().top;
44			}
45			
46			//actual logic to check if we want to "stick to top" or not.
47			var menu = $('#ubc7-unit-menu.stick-to-top'); 
48			var win_scrollTop = $(element).scrollTop();
49			if (win_scrollTop > (eTop - adminbar_height)) { 
50				var menu_css = {'position': 'fixed', 'top': adminbar_height};
51				if ($('body.full-width').length > 0) {
52					menu_css['width'] = '100%';
53				}
54				menu.css(menu_css);
55				sticky_obj.place_holder.css('display', 'block');
56			} 
57			if (win_scrollTop < (eTop - adminbar_height)) {
58				menu.css({'position': 'static'});
59				sticky_obj.place_holder.css('display', 'none');
60			}	
61		},
62		
63		/**
64		 * figures out whether bootstrap think it's in phone, tablet, or desktop mode.
65		 * 
66		 * @props http://stackoverflow.com/questions/14441456/how-to-detect-which-device-view-youre-on-using-twitter-bootstrap-api
67		 * @returns string
68		 */
69		findBootstrapEnvironment: function() {
70			var envs = ['phone', 'tablet', 'desktop'];
71
72		    $el = $('<div>');
73		    $el.appendTo($('body'));
74
75		    for (var i = envs.length - 1; i >= 0; i--) {
76		        var env = envs[i];
77
78		        $el.addClass('hidden-'+env);
79		        if ($el.is(':hidden')) {
80		            $el.remove();
81		            return env
82		        }
83		    };
84		}
85	}
86	
87	jQuery(window).scroll(function() {
88		sticky_obj.on_scroll( this );
89	});
90	
91}(jQuery));
92
93//properly handle resizing of window relative to menu bar and stickiness
94jQuery(window).resize(function() {
95	sticky_obj.env = sticky_obj.findBootstrapEnvironment();
96	var main_menu = jQuery('#ubc7-unit-menu ul:first');
97	var sticky = jQuery('#ubc7-unit-menu.stick-to-top');
98	
99	//if no main nav or no sticky class, do nothing!
100	if (sticky.length == 0 || main_menu.length == 0 || sticky_obj.place_holder == false) {
101		return;
102	}
103	
104	if (sticky_obj.env == 'desktop') {
105		sticky.css({'position': 'static'});
106		sticky_obj.place_holder.css('height', main_menu.height());
107	} else {
108		sticky_obj.place_holder.css('height', '0px');
109	} 
110});