Docs

[steevka]

Hey Themeco support!

I followed this thread and the two buttons work perfectly.

But I have one accordion that I use for quick navigation that I would like to be unaffected by the expand/collapse all buttons. Is there way to assign an ID to it and have it remain closed?

Thanks and happy new years!

[Christopher]

Hi there,

Happy New Year!

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[steevka]

This reply has been marked as private.

[Jade]

Hi there,

Is there any reason why you are trying to use an accordion element and not wanting it to function as an accordion?

You can try adding a Custom Headline element instead then add an ID to it then add this CSS in the customizer:

#theID {
    border: 1px solid #000000;
    background-color: #3d3d3d;
    background: -webkit-gradient(linear,left top,left bottom,color-stop(50%,#3d3d3d),color-stop(50%,#3d3d3d),color-stop(50%,#212121));
    background: -webkit-linear-gradient(top,#3d3d3d,#212121);
    background: -moz-linear-gradient(top,#3d3d3d,#212121);
    background: -ms-linear-gradient(top,#3d3d3d,#212121);
    background: -o-linear-gradient(top,#3d3d3d,#212121);
    -webkit-box-shadow: inset 1px 1px 0 0 rgba(255,255,255,0.1);
    -moz-box-shadow: inset 1px 1px 0 0 rgba(255,255,255,0.1);
    box-shadow: inset 1px 1px 0 0 rgba(255,255,255,0.1);
    color: #d9d9d9;
}

Hope this helps.

[steevka]

Sorry, I probably wasn’t clear enough with my description.

I want it to act as an accordion when I click it directly, but not when I click the ‘expand all’ button. As of right now when I click the expand all button, a javascript is triggered that targets ALL accordions on the page. I want to exclude the Quick Nav from that javascript event. The link in my first post shows the javascript that I am using:

jQuery ( function($) {
$('.expandall_accord').on('click', function( e ){
$('.x-accordion-body').collapse('show');
e.preventDefault();
});

$('.collapseall_accord').on('click', function( e ){
$('.x-accordion-body').collapse('hide');
e.preventDefault();
});
} );

[Paul R]

Hi,

To exclude quick nav, please change your code to this.

jQuery ( function($) {
$('.expandall_accord').on('click', function( e ){
$('.x-accordion-body').not('#quicknav .x-accordion-body').collapse('show');
e.preventDefault();
});

$('.collapseall_accord').on('click', function( e ){
$('.x-accordion-body').not('#quicknav .x-accordion-body').collapse('hide');
e.preventDefault();
});
} );

Hope that helps

[steevka]

THANK YOU! Works perfectly.

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts