Collapse section takes me to top of page

[ArcaneE]

Hi!

My site is ccvd.lachachineavapeur.ca. On the page: http://ccvd.lamachineavapeur.ca/avantage-aux-membres/#

I’ve been looking through the different posts for collapsible sections and I’m fully aware you don’t support custom development in this forum. This being said, my JS works like a charm with what I found except that every section I trigger down with the button takes me back to the top of the page. I have 19 sections in total, here’s the JS code:

jQuery(document).ready(function($){
$( ‘#one’ ).slideToggle(0);
$( ‘#one-trigger-button’ ).click(function() {
$( ‘#one’ ).slideToggle( “slow” );
});
});

jQuery(document).ready(function($){
$( ‘#deux’ ).slideToggle(0);
$( ‘#deux-trigger-button’ ).click(function() {
$( ‘#deux’ ).slideToggle( “slow” );
});
});

jQuery(document).ready(function($){
$( ‘#trois’ ).slideToggle(0);
$( ‘#trois-trigger-button’ ).click(function() {
$( ‘#trois’ ).slideToggle( “slow” );
});
});

});

And so on the all 19 sections. Any way I can tweak it so it doesn’t jump up back at the top?

Thank you in advance for your help!

[jade]

Hi there,

You will have to add the event.preventDefault() in the click function.

For example:

jQuery(document).ready(function($){
    $( '#deux' ).slideToggle(0);
    $( '#deux-trigger-button' ).click(function( event ) {
        event.preventDefault();
        $( '#deux' ).slideToggle( "slow" );
    });
});

Hope this helps.

[ArcaneE]

Hi Jade,

As usual, your help is quick and on point.

Works like a charm.

Thanks a lot and have a great day!

[Prasant]

Glad to hear that.