90%
top of page

Add a Title

Add a Title
Published Date
Published Date
Tags
0 Comments
Views
Share Post

Comment

successMessage

errorMessage

Add a Title

Add paragraph text. Click “Edit Text” to update the font, size and more. To change and reuse text themes, go to Site Styles.

Add a Title

No comments yet. Be the first to comment!"

Related Posts

Start Now
Start Now

Add paragraph text. Click “Edit Text” to update the font, size and more. To change and reuse text themes, go to Site Styles.

Add a Title

Start Now
Start Now

Add paragraph text. Click “Edit Text” to update the font, size and more. To change and reuse text themes, go to Site Styles.

Add a Title

Start Now
Start Now

Add paragraph text. Click “Edit Text” to update the font, size and more. To change and reuse text themes, go to Site Styles.

Add a Title

  • Writer: @lan Design
    @lan Design
  • Dec 15, 2020
  • 1 min read

Updated: Dec 29, 2023

If you want to create a custom FAQ section, step-by-step guide, or want to provide your users with more information when they toggle a dropdown section, then this is a great addition to your website.

Collapsib;e section

$w.onReady(function(){

	$w('#stepOneCollapseButton').onClick(()=>{
		toggleBox($w('#stepOneCollapibleStrip'),
$w('#stepOnePlusSign'),       $w('#StepOneMinusSign'));
});
	$w('#stepTwoCollapseButton').onClick(()=>{
		toggleBox($w('#stepTwoCollapibleStrip'),
$w('#stepTwoPlusSign'),$w('#StepTwoMinusSign'));
});
	$w('#stepThreeCollapseButton').onClick(()=>{
		toggleBox($w('#stepThreeCollapibleStrip'),
$w('#stepThreePlusSign'),$w('#StepThreeMinusSign'));

});

});

functiontoggleBox(boxElement,plusSign,minusSign){
	constisCollapsed=boxElement.collapsed;
	if(isCollapsed){
		plusSign.hide();
		minusSign.show();
		boxElement.expand();
       } else {
		minusSign.hide();
	plusSign.show();
boxElement.collapse();

	}

}

Now you can create a really cool custom collapsible section for your website! Have Fun!

Comments


bottom of page