header.js 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. ( function( $ ) {
  2. var debounce = function( func, wait ) {
  3. var timeout, args, context, timestamp;
  4. return function() {
  5. context = this;
  6. args = [].slice.call( arguments, 0 );
  7. timestamp = new Date();
  8. var later = function() {
  9. var last = ( new Date() ) - timestamp;
  10. if ( last < wait ) {
  11. timeout = setTimeout( later, wait - last );
  12. } else {
  13. timeout = null;
  14. func.apply( context, args );
  15. }
  16. };
  17. if ( ! timeout ) {
  18. timeout = setTimeout( later, wait );
  19. }
  20. };
  21. };
  22. function headerStyle() {
  23. var featuredContent, featuredContentHeight;
  24. featuredContent = $( '#featured-content' );
  25. featuredContentHeight = 0;
  26. if ( featuredContent.length ) {
  27. featuredContentHeight = featuredContent.outerHeight();
  28. }
  29. if ( $( '.site-branding' ).outerWidth() === 0 ) {
  30. $( 'body' ).addClass( 'no-branding' );
  31. } else {
  32. $( 'body' ).removeClass( 'no-branding' );
  33. }
  34. if ( $( '.site-branding' ).outerWidth() + $( '.main-navigation' ).outerWidth() + 15 >= $( '.site-header-inner' ).outerWidth() && $( window ).width() > 839 ) {
  35. $( 'body' ).addClass( 'long-menu' );
  36. $( '.main-navigation' ).css( 'margin-top', '' );
  37. } else if ( $( window ).width() < 840 ) {
  38. $( 'body' ).removeClass( 'long-menu' );
  39. $( '.main-navigation' ).css( 'margin-top', '' );
  40. } else {
  41. $( 'body' ).removeClass( 'long-menu' );
  42. $( '.main-navigation' ).css( 'margin-top', ( $( '.site-header' ).height() - $( '.main-navigation' ).outerHeight() ) / 2 );
  43. }
  44. $( window ).scroll( function() {
  45. if ( $( document.body ).hasClass( 'unfixed-header' ) ) {
  46. return;
  47. }
  48. if ( $( document ).scrollTop() > featuredContentHeight && $( window ).width() > 959 ) {
  49. $( document.body ).addClass( 'fixed' ).css( 'padding-top', $( '#masthead' ).outerHeight() );
  50. } else {
  51. $( document.body ).removeClass( 'fixed' ).css( 'padding-top', '' );
  52. }
  53. } );
  54. }
  55. $( window ).load( headerStyle ).resize( debounce( headerStyle, 500 ) );
  56. } )( jQuery );