CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-accordion
thomasp423
thomasp423

Reputation: 367

Working chevron icons for jQuery UI Accordion

I'm trying to learn how to do this. I've posted a few times today sorry about that.

The problem: Tab is selected and chevron changes from down to up (great) but when another tab is selected the previous tab doesn't go back to default down. I am using up and down classes to add the chevron image icons.

jQuery

// Chevron icons move up and down 
$(function() {
//Add down to all .chevrons
$(".section a .chevron").addClass('down'); 

//Toggle up/down classes
$(".section a").click(function() {
    var $chevron = $(this).find('.chevron'); 
    $chevron.toggleClass("down up");
});
});

Upvotes: 0

Views: 529

Answers (1)

bbecks
bbecks

Reputation: 11

You could just select all and and remove the up class on click. Something like:

$(".section a").click(function() {
    $(".section a .chevron").removeClass('up').addClass('down'); 
    var $chevron = $(this).find('.chevron'); 
    $chevron.toggleClass("down up");
});

Upvotes: 1

Related Questions