51 * @param {Object} el Title element of the accordion section to toggle. |
51 * @param {Object} el Title element of the accordion section to toggle. |
52 * @since 3.6.0 |
52 * @since 3.6.0 |
53 */ |
53 */ |
54 function accordionSwitch ( el ) { |
54 function accordionSwitch ( el ) { |
55 var section = el.closest( '.accordion-section' ), |
55 var section = el.closest( '.accordion-section' ), |
56 siblings = section.closest( '.accordion-container' ).find( '.open' ), |
56 sectionToggleControl = section.find( '[aria-expanded]' ).first(), |
|
57 container = section.closest( '.accordion-container' ), |
|
58 siblings = container.find( '.open' ), |
|
59 siblingsToggleControl = siblings.find( '[aria-expanded]' ).first(), |
57 content = section.find( '.accordion-section-content' ); |
60 content = section.find( '.accordion-section-content' ); |
58 |
61 |
59 // This section has no content and cannot be expanded. |
62 // This section has no content and cannot be expanded. |
60 if ( section.hasClass( 'cannot-expand' ) ) { |
63 if ( section.hasClass( 'cannot-expand' ) ) { |
61 return; |
64 return; |
62 } |
65 } |
63 |
66 |
|
67 // Add a class to the container to let us know something is happening inside. |
|
68 // This helps in cases such as hiding a scrollbar while animations are executing. |
|
69 container.addClass( 'opening' ); |
|
70 |
64 if ( section.hasClass( 'open' ) ) { |
71 if ( section.hasClass( 'open' ) ) { |
65 section.toggleClass( 'open' ); |
72 section.toggleClass( 'open' ); |
66 content.toggle( true ).slideToggle( 150 ); |
73 content.toggle( true ).slideToggle( 150 ); |
67 } else { |
74 } else { |
|
75 siblingsToggleControl.attr( 'aria-expanded', 'false' ); |
68 siblings.removeClass( 'open' ); |
76 siblings.removeClass( 'open' ); |
69 siblings.find( '.accordion-section-content' ).show().slideUp( 150 ); |
77 siblings.find( '.accordion-section-content' ).show().slideUp( 150 ); |
70 content.toggle( false ).slideToggle( 150 ); |
78 content.toggle( false ).slideToggle( 150 ); |
71 section.toggleClass( 'open' ); |
79 section.toggleClass( 'open' ); |
72 } |
80 } |
|
81 |
|
82 // We have to wait for the animations to finish |
|
83 setTimeout(function(){ |
|
84 container.removeClass( 'opening' ); |
|
85 }, 150); |
|
86 |
|
87 // If there's an element with an aria-expanded attribute, assume it's a toggle control and toggle the aria-expanded value. |
|
88 if ( sectionToggleControl ) { |
|
89 sectionToggleControl.attr( 'aria-expanded', String( sectionToggleControl.attr( 'aria-expanded' ) === 'false' ) ); |
|
90 } |
73 } |
91 } |
74 |
92 |
75 })(jQuery); |
93 })(jQuery); |