Created
January 28, 2014 22:48
-
-
Save Quilted/8678268 to your computer and use it in GitHub Desktop.
Sticky footer JS and Omega theme code
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
// Load the matchMedia polyfill. | |
if (module_exists('picture') && drupal_get_library('picture', 'matchmedia')) { | |
$options = array('group' => 'globalgamejam_theme'); | |
// Load the mediaquery behavior from Omega. This allows registering media | |
// queries via Drupal.settings to automatically print body classes based on | |
// whether or not they currently apply. | |
$omega = drupal_get_path('theme', 'omega'); | |
drupal_add_js("$omega/js/omega.mediaqueries.js", $options); | |
// Register the media queries. The array keys will be used to compose the body | |
// class names and the values are the actual media queries. | |
drupal_add_js(array('omega' => array('mediaQueries' => array( | |
'mobile' => 'all', | |
'narrow' => 'all and (min-width: 740px)', | |
'normal' => 'all and (min-width: 980px)', | |
'wide' => 'all and (min-width: 1220px)', | |
))), 'setting'); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function ($) { | |
$(document).ready(function() { | |
stickyFooterReset(); | |
}); | |
/** | |
* Sticky footer | |
*/ | |
Drupal.behaviors.stickyFooterBreakpoint = { | |
attach: function (context, settings) { | |
$('body').bind('responsivelayout', function(evt, newBreakpoint) { | |
Drupal.behaviors.stickyFooter.attach(context, settings); | |
}); | |
} | |
}; | |
Drupal.behaviors.stickyFooter = { | |
attach: function (context, settings) { | |
stickyFooterReset(); | |
// If the | |
var omegaSettings = settings.omega || {}; | |
var mediaQueries = omegaSettings.mediaQueries || {}; | |
var currentBreakpoint; | |
$.each(mediaQueries, function (index, value) { | |
var mql = window.matchMedia(value); | |
if (mql.matches == true) { | |
currentBreakpoint = index; | |
} | |
}); | |
switch (currentBreakpoint) { | |
case 'wide': | |
case 'normal': | |
case 'narrow': | |
// Don't trigger sticky footer on ever window resize | |
// Drupal.theme('stickyFooter'); | |
$(window).off('resize', stickyFooterReset); | |
break; | |
case 'mobile': | |
// Trigger sticky footer on every window resize | |
$(window).on('resize', stickyFooterReset); | |
break; | |
} | |
} | |
}; | |
/** | |
* Override Omega's Media Query Class handler. | |
*/ | |
Drupal.behaviors.omegaMediaQueryClasses.handler = function (name, mql) { | |
$.event.trigger('responsivelayout', {current: name}); | |
if (mql.matches) { | |
$('body').removeClass(name + '-inactive').addClass(name + '-active'); | |
} | |
else { | |
$('body').removeClass(name + '-active').addClass(name + '-inactive'); | |
} | |
} | |
var stickyFooterReset = function() { | |
// // Unset the height of the content. | |
$('.l-content').height('inherit'); | |
var winHeight = $(window).height(); | |
var footerHeight = $('.l-footer').outerHeight(true); | |
var mainMarginTop = $('.l-main').offset().top; | |
// Fix the main section padding bottom to exactly match the footer. | |
var paddingBottom = parseInt(footerHeight); | |
$('.l-main').css('padding-bottom', paddingBottom); | |
// If the height of the content is smaller than the white background, | |
// then make the white background the full height. | |
var winHeight = $(window).height(); | |
var footerHeight = $('.l-footer').height(); | |
var contentTop = $('.l-content').offset().top; | |
var whiteContent = winHeight - footerHeight - contentTop - mainMarginTop; | |
if ($('.l-content').height() < whiteContent) { | |
$('.l-content').height(whiteContent); | |
} | |
} | |
})(jQuery); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment