back
updated — july 4
code component
FAQ
Using our component
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ
Built inside Framer
Why should I use this component?
First of all because it won't break the fluid motion when expanding and collapsing. The way Framer uses motion inside the dom is by transform and scale, so if you won't wrap everything on the page in one huge component (which applies motion to all emenents) it will break the motion.
How does this component fix the issue?
We found a work-around using the capabilities of JS and other little tricks and the result is having all other sections and components on the page wrap around animating smoothly all together.
Is it hard to set-up?
Absolutely not. In fact is a lot faster than having to design it manually in Framer. You can get your FAQ section with this component in a matter of seconds.
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ Component
new
When creating a FAQ accordion inside Framer and placing it on the page it won't apply the Framer motion to all of the elements on the page, only on the component itself. That makes the motion break when expanding and collapsing. We found a solution and a fix for that so you can build your FAQ sections in a matter of seconds and keep all the smooth motion without having to wrap a bunch of sections into a big component in order to keep the smooth motion.
updated — july 4
code component
FAQ
Using our component
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ
Built inside Framer
Why should I use this component?
First of all because it won't break the fluid motion when expanding and collapsing. The way Framer uses motion inside the dom is by transform and scale, so if you won't wrap everything on the page in one huge component (which applies motion to all emenents) it will break the motion.
How does this component fix the issue?
We found a work-around using the capabilities of JS and other little tricks and the result is having all other sections and components on the page wrap around animating smoothly all together.
Is it hard to set-up?
Absolutely not. In fact is a lot faster than having to design it manually in Framer. You can get your FAQ section with this component in a matter of seconds.
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ Component
new
When creating a FAQ accordion inside Framer and placing it on the page it won't apply the Framer motion to all of the elements on the page, only on the component itself. That makes the motion break when expanding and collapsing. We found a solution and a fix for that so you can build your FAQ sections in a matter of seconds and keep all the smooth motion without having to wrap a bunch of sections into a big component in order to keep the smooth motion.
updated — july 4
code component
FAQ
Tap below to test it out.
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ
Built inside Framer
Why should I use this component?
First of all because it won't break the fluid motion when expanding and collapsing. The way Framer uses motion inside the dom is by transform and scale, so if you won't wrap everything on the page in one huge component (which applies motion to all emenents) it will break the motion.
How does this component fix the issue?
We found a work-around using the capabilities of JS and other little tricks and the result is having all other sections and components on the page wrap around animating smoothly all together.
Is it hard to set-up?
Absolutely not. In fact is a lot faster than having to design it manually in Framer. You can get your FAQ section with this component in a matter of seconds.
Set-up your faq in seconds
Setting up your faq has never been easier. On top of that it's also smooth and fully adjustable and responsive without breaking the animation.
FAQ Component
new
When creating a FAQ accordion inside Framer and placing it on the page it won't apply the Framer motion to all of the elements on the page, only on the component itself. That makes the motion break when expanding and collapsing. We found a solution and a fix for that so you can build your FAQ sections in a matter of seconds and keep all the smooth motion without having to wrap a bunch of sections into a big component in order to keep the smooth motion.
FAQ Component
When creating a FAQ accordion inside Framer and placing it on the page it won't apply the Framer motion to all of the elements on the page, only on the component itself. That makes the motion break when expanding and collapsing. We found a solution and a fix for that so you can build your FAQ sections in a matter of seconds and keep all the smooth motion without having to wrap a bunch of sections into a big component in order to keep the smooth motion. You can test it out live on the left side by playing around with both versions.
FAQ Component
When creating a FAQ accordion inside Framer and placing it on the page it won't apply the Framer motion to all of the elements on the page, only on the component itself. That makes the motion break when expanding and collapsing. We found a solution and a fix for that so you can build your FAQ sections in a matter of seconds and keep all the smooth motion without having to wrap a bunch of sections into a big component in order to keep the smooth motion. You can test it out live on the left side by playing around with both versions.
Adjustable properties
Unlimited FAQ items
Easy to re-order
Native font styling
Unlimited styling possibilities
Native transition options
Adjustable properties
Unlimited FAQ items
Easy to re-order
Native font styling
Unlimited styling possibilities
Native transition options
Adjustable properties
Unlimited FAQ items
Easy to re-order
Native font styling
Unlimited styling possibilities
Native transition options
How do I use it?
You need to copy the component and then simply paste it in your Framer project. It will automatically import and appear in your left sidebar in the Assets tab under components - Eleveight Supply folder. From there you can drag it into your canvas for a new instance.
How do I use it?
You need to copy the component and then simply paste it in your Framer project. It will automatically import and appear in your left sidebar in the Assets tab under components - Eleveight Supply folder. From there you can drag it into your canvas for a new instance.
How do I use it?
You need to copy the component and then simply paste it in your Framer project. It will automatically import and appear in your left sidebar in the Assets tab under components - Eleveight Supply folder. From there you can drag it into your canvas for a new instance.
Follow us on x.com
Say hello: sales@eleveight.supply
Follow us on x.com
Say hello: sales@eleveight.supply
Follow us on x.com
Say hello: sales@eleveight.supply