/** * Trestle theme jQuery * * @since 1.0.0 * * @package Trestle */ // Executes when the document is ready jQuery(document).ready(function( $ ) { // Get PHP vars passed via wp_localize_script() trestleEqualColsBreakpoint = trestle_vars.trestle_equal_cols_breakpoint; trestleEqualHeightCols = trestle_vars.trestle_equal_height_cols; // Remove .no-jquery body class $('body').removeClass('no-jquery'); // External Links var h = window.location.host.toLowerCase(); $('[href^="http"]').not('[href*="' + h + '"]').addClass('external-link').attr("target", "_blank"); // Add classes to different types of links $('a[href^="mailto:"]').addClass('email-link'); $('a[href*=".pdf"]').attr({"target":"_blank"}).addClass('pdf-link'); $('a[href*=".doc"]').attr({"target":"_blank"}).addClass('doc-link'); $('a').has('img').addClass('image-link'); // Add classes to parts of lists $('li:last-child').addClass('last'); $('li:first-child').addClass('first'); $('ul, ol').parent('li').addClass('parent'); // Mobile header toggle buttons $('.site-header .title-area').after('
'); $('.site-header .widget-area, .nav-primary').each(function(i) { var target = $(this); var buttonClass = 'toggle-button'; // Add classes of target element var targetClass = target.attr('class').split(/\s+/); $.each(targetClass, function(index,value) { buttonClass += ' targets-' + value; }); if ( $(this).is( 'nav' ) ) { buttonClass += ' nav-toggle'; } // Add toggle buttons to header $('.toggle-buttons').prepend('Toggle'); // Add target class to nav and widget areas target.addClass('toggle-target-' + i ); }); // Toggle widget areas and primary nav $('.site-header .toggle-button').click( function( event ) { // Prevent default behavior event.preventDefault(); // Get toggle button that was clicked var button = $(this); // Remove focus button.blur(); var target = $( '.toggle-target-' + button.attr('id').match(/\d+/) ); // Toggle buttons button.toggleClass('open'); $('.site-header .toggle-button').not(button).removeClass('open'); // Toggle targets target.toggleClass('open'); $('[class*="toggle-target"]').not(target).removeClass('open'); }); // Mobile navigation icons var closedIcon = '+'; var openIcon = '-'; $('.nav-primary').find('.genesis-nav-menu .parent:not(.current-menu-item, .current_page_item, .current_page_parent, .current_page_ancestor) > a').after('' + closedIcon + ''); $('.nav-primary').find('.genesis-nav-menu .parent.current-menu-item > a, .genesis-nav-menu .parent.current_page_item > a, .genesis-nav-menu .parent.current_page_parent > a, .genesis-nav-menu .parent.current_page_ancestor > a').after('' + openIcon + ''); // Mobile navigation expand/contract functionality $('.sub-icon').click(function(event) { // Prevent default behavior event.preventDefault(); // Get icon clicked var icon = $(this); // Remove focus icon.blur(); icon.next('ul').slideToggle().toggleClass('open'); if ( icon.text().indexOf( closedIcon ) !== -1 ) icon.text(openIcon); else if ( icon.text().indexOf( openIcon ) !== -1 ) icon.text(closedIcon); }); $('.widget-area-toggle').click(function(event) { // Prevent default behavior event.preventDefault(); // Get button clicked var button = $(this); // Remove focus button.blur(); button.toggleClass('open'); button.next('.widget-area').slideToggle(); }); // Equal height homepage cols $('.equal-height-genesis-extender-cols .ez-home-container-area').each(function() { $(this).children('.widget-area').equalHeights(null,null,trestleEqualColsBreakpoint); }); }); /* end of as page load scripts */ // Executes when complete page is fully loaded, including all frames, objects, and images jQuery(window).load(function( $ ) { }); /** * Equal Heights Plugin * * Equalize the heights of elements. Great for columns or any elements * that need to be the same size (floats, etc). * * Based on Rob Glazebrook's (cssnewbie.com) script * * Additions * - ability to include a break point (the minimum viewport width at which the script does anything) * - binds the script to run on load, orientation change (for mobile), and when resizing the window * * Usage: jQuery(object).equalHeights([minHeight], [maxHeight], [breakPoint]); * * Example 1: jQuery(".cols").equalHeights(); Sets all columns to the same height. * Example 2: jQuery(".cols").equalHeights(400); Sets all cols to at least 400px tall. * Example 3: jQuery(".cols").equalHeights(100,300); Cols are at least 100 but no more * than 300 pixels tall. Elements with too much content will gain a scrollbar. * Example 4: jQuery(".cols").equalHeights(null, null,768); Only resize columns above 768px viewport * */ (function( $ ) { $.fn.equalHeights = function(minHeight, maxHeight, breakPoint) { var items = this; breakPoint = breakPoint || 0; // Bind functionality to appropriate events $(window).on('load orientationchange resize equalheights', function() { tallest = (minHeight) ? minHeight : 0; items.each(function() { $(this).height('auto'); if($(this).outerHeight() > tallest) { tallest = $(this).outerHeight(); } }); // Get viewport width (taking scrollbars into account) var e = window; a = 'inner'; if (!('innerWidth' in window )) { a = 'client'; e = document.documentElement || document.body; } width = e[ a+'Width' ]; // Equalize column heights if above the specified breakpoint if ( width >= breakPoint ) { if((maxHeight) && tallest > maxHeight) tallest = maxHeight; console.log(tallest); return items.each(function() { $(this).height(tallest); }); } }); } })(jQuery);