Collapsible Sections with Velo

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.

---

$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!