javascript - Accordion not closing -
good evening,
i have accordion on site working on. has annoying bug can't figure out.
if click on arrow, accordion open , close correctly. if click on title, accordion open bounce when try close it.
both title , arrow within same anchor understand why happening.
the code is:
<div class="accordion"> <div class="accordion-section"> <div class="tab"> <a class="accordion-title accordion-section-button l2" href="#accordion-205"> <h3>how differ estate agents?</h3> </a> <div id="accordion-205" class="accordion-section-content"> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. nunc mattis ante eget quam volutpat, ac pulvinar massa ornare.</p> </div> </div> <div class="tab"> <a class="accordion-title accordion-section-button l2" href="#accordion-204"> <h3>why estate agent prefer speaking or dealing yourself?</h3> </a> <div id="accordion-204" class="accordion-section-content"> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. nunc mattis ante eget quam volutpat, ac pulvinar massa ornare.</p> </div> </div> </div> </div> $(document).ready(function() { function close_accordion_section() { $('.accordion .accordion-section-button').removeclass('active'); $('.accordion .accordion-section-content').slideup(300).removeclass('open'); } $('.accordion-section-button').click(function(e) { // grab current anchor value var currentattrvalue = $(this).attr('href'); if($(e.target).is('.active')) { close_accordion_section(); }else { close_accordion_section(); // add active class section title $(this).addclass('active'); // open hidden content panel $('.accordion ' + currentattrvalue).slidedown(300).addclass('open'); } e.preventdefault(); }); });
thanks in advance can me.
the main problem line:
if($(e.target).is('.active')) {
when click on <h3>
element e.target
<h3>
, not <a>
. instead try this:
if($(this).is('.active')) {
note consistent line add class further down.
Comments
Post a Comment